ল্যাবে ধীর মিথস্ক্রিয়া ম্যানুয়ালি নির্ণয় করুন

ম্যানুয়াল পরীক্ষার মাধ্যমে ধীর মিথস্ক্রিয়াগুলির পিছনে কারণগুলি পুনরুত্পাদন এবং সনাক্ত করতে কীভাবে আপনার ফিল্ড ডেটা ল্যাবে নিয়ে যাবে তা শিখুন।

প্রকাশিত: মে 9, 2023

ইন্টারঅ্যাকশন টু নেক্সট পেইন্ট (আইএনপি) অপ্টিমাইজ করার একটি চ্যালেঞ্জিং অংশ হ'ল দুর্বল আইএনপির কারণ কী তা খুঁজে বের করা। অনেকগুলি সম্ভাব্য কারণ রয়েছে, যেমন তৃতীয় পক্ষের স্ক্রিপ্ট যা মূল থ্রেডে অনেকগুলি কাজ নির্ধারণ করে, বড় DOM আকার , ব্যয়বহুল ইভেন্ট কলব্যাক এবং অন্যান্য অপরাধী।

INP উন্নত করা কঠিন হতে পারে। শুরু করার জন্য, আপনাকে জানতে হবে কোন ইন্টারঅ্যাকশনগুলি একটি পৃষ্ঠার INP-এর জন্য দায়ী। আপনি যদি জানেন না যে আপনার ওয়েবসাইটে কোন ইন্টারঅ্যাকশনগুলি প্রকৃত ব্যবহারকারীর দৃষ্টিকোণ থেকে সবচেয়ে ধীর হতে থাকে, তাহলে ক্ষেত্রের মধ্যে ধীর মিথস্ক্রিয়া খুঁজুন পড়ুন। আপনাকে গাইড করার জন্য একবার আপনার কাছে ফিল্ড ডেটা থাকলে, আপনি সেই নির্দিষ্ট ইন্টারঅ্যাকশনগুলিকে ল্যাব সরঞ্জামগুলিতে ম্যানুয়ালি পরীক্ষা করতে পারেন কেন সেই মিথস্ক্রিয়াগুলি ধীর হয়।

আপনার যদি ফিল্ড ডেটা না থাকে?

ফিল্ড ডেটা থাকা অত্যাবশ্যক, কারণ এটি কোন ইন্টারঅ্যাকশনগুলিকে অপ্টিমাইজ করা দরকার তা খুঁজে বের করার চেষ্টা করে আপনার অনেক সময় বাঁচায়। যদিও আপনি এমন একটি অবস্থানে থাকতে পারেন যেখানে আপনার ফিল্ড ডেটা নেই। যদি এটি আপনার পরিস্থিতি বর্ণনা করে, তবে উন্নতির জন্য মিথস্ক্রিয়াগুলি খুঁজে পাওয়া এখনও সম্ভব, যদিও এটির জন্য একটু বেশি প্রচেষ্টা এবং একটি ভিন্ন পদ্ধতির প্রয়োজন।

টোটাল ব্লকিং টাইম (TBT) হল একটি ল্যাব মেট্রিক যা লোডের সময় পৃষ্ঠার প্রতিক্রিয়াশীলতার মূল্যায়ন করে এবং এটি INP-এর সাথে ভালভাবে সম্পর্কযুক্ত । আপনার পৃষ্ঠায় উচ্চ TBT থাকলে, এটি একটি সম্ভাব্য সংকেত যে পৃষ্ঠা লোড হওয়ার সাথে সাথে আপনার পৃষ্ঠা ব্যবহারকারীর ইন্টারঅ্যাকশনের জন্য খুব বেশি প্রতিক্রিয়াশীল নাও হতে পারে।

আপনার পৃষ্ঠার TBT বের করতে, আপনি যে কোনো একটি Lighthouse ব্যবহার করতে পারেন। যদি একটি পৃষ্ঠার TBT বেশি হয়, তাহলে পৃষ্ঠা লোডের সময় মূল থ্রেডটি খুব ব্যস্ত থাকার সম্ভাবনা থাকে এবং এটি পৃষ্ঠার জীবনচক্রের সেই গুরুত্বপূর্ণ সময়ে একটি পৃষ্ঠা কতটা প্রতিক্রিয়াশীল তা প্রভাবিত করতে পারে।

পৃষ্ঠাটি লোড হওয়ার পরে ধীর মিথস্ক্রিয়া খুঁজে পেতে, আপনার অন্যান্য ধরণের ডেটার প্রয়োজন হতে পারে, যেমন সাধারণ ব্যবহারকারীর প্রবাহ যা আপনি ইতিমধ্যে আপনার ওয়েবসাইটের বিশ্লেষণে চিহ্নিত করেছেন। আপনি যদি একটি ইকমার্স ওয়েবসাইটে কাজ করেন, উদাহরণস্বরূপ, একটি সাধারণ ব্যবহারকারীর প্রবাহ হবে ব্যবহারকারীরা যখন তারা একটি অনলাইন শপিং কার্টে আইটেম যোগ করে এবং চেক আউট করে তখন তারা যে পদক্ষেপগুলি নেয়।

আপনার ফিল্ড ডেটা থাকুক বা না থাকুক, পরবর্তী ধাপ হল ম্যানুয়ালি পরীক্ষা করা এবং ধীর মিথস্ক্রিয়াগুলি পুনরুত্পাদন করা—কারণ এটি শুধুমাত্র যখন আপনি একটি ধীর মিথস্ক্রিয়া পুনরুত্পাদন করতে সক্ষম হন যে আপনি এটি ঠিক করতে পারেন৷

ল্যাবে ধীর মিথস্ক্রিয়া পুনরুত্পাদন করুন

ম্যানুয়াল পরীক্ষার মাধ্যমে আপনি ল্যাবে ধীর মিথস্ক্রিয়াগুলি পুনরুত্পাদন করতে পারেন এমন অনেকগুলি উপায় রয়েছে, তবে নিম্নলিখিতটি একটি কাঠামো যা আপনি চেষ্টা করতে পারেন।

DevTools পারফরম্যান্স প্যানেল লাইভ মেট্রিক্স

DevTools পারফরম্যান্স প্রোফাইলার হল ধীরগতির পরিচিত মিথস্ক্রিয়া নির্ণয়ের জন্য প্রস্তাবিত পদ্ধতি, কিন্তু যখন আপনি জানেন না যে কোন ইন্টারঅ্যাকশনগুলি আপনার সমস্যাযুক্ত তা শনাক্ত করতে সময় নিতে পারে।

আপনি যখন প্রথম পারফরম্যান্স প্যানেল খুলবেন তখন আপনি একটি লাইভ মেট্রিক্স ভিউ দেখতে পাবেন। আপনি আরও বিশদ পারফরম্যান্স প্রোফাইলারে যাওয়ার আগে, সমস্যাযুক্তগুলি খুঁজে পেতে এটি দ্রুত কয়েকটি মিথস্ক্রিয়া চেষ্টা করার জন্য ব্যবহার করা যেতে পারে। আপনি ইন্টারঅ্যাকশন করার সাথে সাথে ডায়াগনস্টিক ডেটা ইন্টারঅ্যাকশন লগে উপস্থিত হবে (আইএনপি ইন্টারঅ্যাকশন হাইলাইট করা সহ)। ফেজ ব্রেকডাউন পেতে এই মিথস্ক্রিয়াগুলি প্রসারিত করা যেতে পারে: