নেক্সট পেইন্টের সাথে মিথস্ক্রিয়া (INP)

জেরেমি ওয়াগনার

ব্রাউজার সমর্থন

  • ক্রোম: 96।
  • প্রান্ত: 96।
  • ফায়ারফক্স: সমর্থিত নয়।
  • সাফারি: সমর্থিত নয়।

উৎস

ক্রোম ব্যবহারের ডেটা দেখায় যে একটি পৃষ্ঠা লোড হওয়ার পরে ব্যবহারকারীর 90% সময় ব্যয় হয়, এইভাবে, পৃষ্ঠার জীবনচক্র জুড়ে প্রতিক্রিয়াশীলতার যত্নশীল পরিমাপ গুরুত্বপূর্ণ। এই INP মেট্রিক মূল্যায়ন কি.

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

কিছু মিথস্ক্রিয়া স্বাভাবিকভাবেই অন্যদের তুলনায় বেশি সময় নেয়, কিন্তু বিশেষ করে জটিল মিথস্ক্রিয়াগুলির জন্য, ব্যবহারকারীকে কিছু ঘটছে তা বলার জন্য দ্রুত কিছু প্রাথমিক ভিজ্যুয়াল প্রতিক্রিয়া উপস্থাপন করা গুরুত্বপূর্ণ। ব্রাউজার যে পরবর্তী ফ্রেমটি আঁকবে তা হল এটি করার প্রথম সুযোগ।

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

নিচের ভিডিওতে, ডানদিকের উদাহরণটি তাৎক্ষণিক ভিজ্যুয়াল ফিডব্যাক দেয় যে একটি অ্যাকর্ডিয়ন খুলছে। খারাপ প্রতিক্রিয়াশীলতা বাম দিকে উদাহরণ হিসাবে প্রদর্শিত হয়, এবং এটি কিভাবে খারাপ ব্যবহারকারীর অভিজ্ঞতা তৈরি করতে পারে।

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

এই নির্দেশিকাটি ব্যাখ্যা করে কিভাবে INP কাজ করে, কিভাবে এটি পরিমাপ করা যায় এবং এটির উন্নতির জন্য সংস্থানগুলি নির্দেশ করে৷

INP কি?

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

কিভাবে INP গণনা করা হয় তার বিশদ বিবরণ

একটি পৃষ্ঠার সাথে করা সমস্ত মিথস্ক্রিয়া পর্যবেক্ষণ করে INP গণনা করা হয়। বেশিরভাগ সাইটের জন্য সবচেয়ে খারাপ লেটেন্সির সাথে মিথস্ক্রিয়া INP হিসাবে রিপোর্ট করা হয়।

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

উচ্চ সংখ্যক মিথস্ক্রিয়া সহ পৃষ্ঠাগুলির জন্য প্রকৃত প্রতিক্রিয়াশীলতার একটি ভাল পরিমাপ দিতে, আমরা প্রতি 50টি ইন্টারঅ্যাকশনের জন্য একটি সর্বোচ্চ মিথস্ক্রিয়া উপেক্ষা করি। বেশিরভাগ পৃষ্ঠার অভিজ্ঞতায় 50টির বেশি ইন্টারঅ্যাকশন নেই, তাই সবচেয়ে খারাপ ইন্টারঅ্যাকশন প্রায়ই রিপোর্ট করা হয়। সমস্ত পৃষ্ঠা দর্শনের 75 তম পার্সেন্টাইল তারপরে যথারীতি রিপোর্ট করা হয়, যা ব্যবহারকারীদের বিশাল সংখ্যাগরিষ্ঠের অভিজ্ঞতা বা আরও ভাল মান দেওয়ার জন্য আউটলারদের সরিয়ে দেয়।

একটি মিথস্ক্রিয়া হল ইভেন্ট হ্যান্ডলারদের একটি গ্রুপ যা একই যৌক্তিক ব্যবহারকারীর অঙ্গভঙ্গির সময় ফায়ার করে। উদাহরণস্বরূপ, একটি টাচস্ক্রিন ডিভাইসে "ট্যাপ" মিথস্ক্রিয়া একাধিক ইভেন্ট অন্তর্ভুক্ত করে, যেমন pointerup , pointerdown , এবং click ৷ একটি মিথস্ক্রিয়া জাভাস্ক্রিপ্ট, CSS, অন্তর্নির্মিত ব্রাউজার নিয়ন্ত্রণ (যেমন ফর্ম উপাদান), বা এর একটি সংমিশ্রণ দ্বারা চালিত হতে পারে।

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

একটি ভাল INP স্কোর কি?

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

আপনি ভাল প্রতিক্রিয়াশীলতার সাথে ব্যবহারকারীর অভিজ্ঞতা প্রদান করছেন তা নিশ্চিত করতে, পরিমাপ করার জন্য একটি ভাল থ্রেশহোল্ড হল ক্ষেত্রটিতে রেকর্ড করা পৃষ্ঠা লোডের 75 তম শতাংশ , মোবাইল এবং ডেস্কটপ ডিভাইস জুড়ে বিভক্ত:

  • 200 মিলিসেকেন্ডের নিচে বা INP মানে একটি পৃষ্ঠার ভালো প্রতিক্রিয়াশীলতা ।
  • 200 মিলিসেকেন্ডের উপরে এবং 500 মিলিসেকেন্ডের নিচে বা 500 মিলিসেকেন্ডে একটি INP মানে একটি পৃষ্ঠার প্রতিক্রিয়াশীলতার উন্নতি প্রয়োজন ৷
  • 500 মিলিসেকেন্ডের উপরে একটি INP মানে একটি পৃষ্ঠার প্রতিক্রিয়াশীলতা দুর্বল ।
ভাল INP মানগুলি 200 মিলিসেকেন্ড বা তার কম, খারাপ মানগুলি 500 মিলিসেকেন্ডের বেশি এবং এর মধ্যে যে কোনও কিছুর উন্নতি প্রয়োজন৷
ভাল INP মান 200 মিলিসেকেন্ড বা তার কম। খারাপ মান 500 মিলিসেকেন্ডের বেশি।

একটি মিথস্ক্রিয়া মধ্যে কি?

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

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

INP এর উদ্দেশ্য হিসাবে, শুধুমাত্র নিম্নলিখিত মিথস্ক্রিয়া প্রকারগুলি পরিলক্ষিত হয়:

  • একটি মাউস দিয়ে ক্লিক করুন.
  • একটি টাচস্ক্রিন সহ একটি ডিভাইসে আলতো চাপুন৷
  • একটি ফিজিক্যাল বা অনস্ক্রিন কীবোর্ডে একটি কী টিপে।

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

মিথস্ক্রিয়া একাধিক ইভেন্ট নিয়ে গঠিত হতে পারে। উদাহরণস্বরূপ, একটি কীস্ট্রোকে keydown , keypress এবং keyup ইভেন্ট অন্তর্ভুক্ত থাকে। ট্যাপ ইন্টারঅ্যাকশনে pointerup এবং pointerdown ইভেন্ট থাকে। মিথস্ক্রিয়াটির মধ্যে দীর্ঘতম সময়কালের ইভেন্টটিই মিথস্ক্রিয়াটির মোট বিলম্বে অবদান রাখে।

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

পৃষ্ঠার INP গণনা করা হয় যখন ব্যবহারকারী পৃষ্ঠাটি ছেড়ে যায়। ফলাফল হল একটি একক মান যা পৃষ্ঠার সমগ্র জীবনচক্র জুড়ে এর সামগ্রিক প্রতিক্রিয়াশীলতার প্রতিনিধিত্ব করে। একটি কম INP মানে একটি পৃষ্ঠা ব্যবহারকারীর ইনপুট নির্ভরযোগ্যভাবে প্রতিক্রিয়াশীল ছিল।

কিভাবে INP প্রথম ইনপুট বিলম্ব (FID) থেকে আলাদা?

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

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

কোন INP মান রিপোর্ট না হলে কি হবে?

একটি পৃষ্ঠার জন্য কোন INP মান ফেরত দেওয়া সম্ভব। নিম্নলিখিতগুলি সহ বেশ কয়েকটি কারণে এটি ঘটতে পারে:

  • পৃষ্ঠাটি লোড করা হয়েছিল, কিন্তু ব্যবহারকারী কখনই তাদের কীবোর্ডে ক্লিক, ট্যাপ বা কী চাপেননি।
  • পৃষ্ঠাটি লোড হয়েছে, কিন্তু ব্যবহারকারী এটির সাথে এমন অঙ্গভঙ্গি ব্যবহার করে ইন্টারঅ্যাক্ট করেছে যা পরিমাপ করা হয় না, যেমন স্ক্রলিং বা উপাদানগুলির উপর ঘোরানো।
  • পৃষ্ঠাটি একটি বট দ্বারা অ্যাক্সেস করা হচ্ছে যেমন একটি অনুসন্ধান ক্রলার বা হেডলেস ব্রাউজার যা পৃষ্ঠাটির সাথে ইন্টারঅ্যাক্ট করার জন্য স্ক্রিপ্ট করা হয়নি।

কিভাবে INP পরিমাপ করা যায়

INP ক্ষেত্র এবং ল্যাব উভয় ক্ষেত্রেই পরিমাপ করা যেতে পারে, যে পরিমাণে আপনি বাস্তবসম্মত ব্যবহারকারীর মিথস্ক্রিয়া অনুকরণ করতে পারেন।

মাঠে

আদর্শভাবে, INP অপ্টিমাইজ করার ক্ষেত্রে আপনার যাত্রা ফিল্ড ডেটা দিয়ে শুরু হবে। সর্বোত্তমভাবে, রিয়েল ইউজার মনিটরিং (RUM) থেকে ফিল্ড ডেটা আপনাকে শুধুমাত্র একটি পৃষ্ঠার INP মান নয়, প্রাসঙ্গিক ডেটাও দেবে যা হাইলাইট করে যে নির্দিষ্ট ইন্টারঅ্যাকশনটি INP মানের জন্য দায়ী ছিল, ইন্টারঅ্যাকশনটি পৃষ্ঠা লোডের সময় বা পরে ঘটেছে কিনা, ইন্টারঅ্যাকশনের ধরন (ক্লিক, কী প্রেস বা ট্যাপ), এবং অন্যান্য মূল্যবান সময় যা আপনাকে সনাক্ত করতে সাহায্য করতে পারে মিথস্ক্রিয়াটির কোন অংশ প্রতিক্রিয়াশীলতাকে প্রভাবিত করছে।

যদি আপনার ওয়েবসাইটটি Chrome ব্যবহারকারীর অভিজ্ঞতা প্রতিবেদনে (CrUX) অন্তর্ভুক্তির জন্য যোগ্য হয়, তাহলে আপনি পেজস্পিড ইনসাইটস (এবং অন্যান্য মূল ওয়েব ভাইটাল) এ CrUX-এর মাধ্যমে INP-এর জন্য দ্রুত ফিল্ড ডেটা পেতে পারেন। ন্যূনতম, আপনি আপনার ওয়েবসাইটের INP-এর একটি মূল-স্তরের ছবি পেতে পারেন, কিন্তু কিছু ক্ষেত্রে, আপনি URL-স্তরের ডেটাও পেতে পারেন।

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

ল্যাবে

সর্বোত্তমভাবে, একবার আপনার কাছে ফিল্ড ডেটা থাকলে আপনি ল্যাবে পরীক্ষা শুরু করতে চাইবেন যা পরামর্শ দেয় যে একটি পৃষ্ঠায় ধীর মিথস্ক্রিয়া আছে। ফিল্ড ডেটা ল্যাবে সমস্যাযুক্ত মিথস্ক্রিয়া পুনরুত্পাদনের কাজটিকে আরও সহজবোধ্য কাজ করে তুলবে।

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

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

কিভাবে INP উন্নত করা যায়

INP অপ্টিমাইজ করার নির্দেশিকাগুলির একটি সংগ্রহ আপনাকে ক্ষেত্রের মধ্যে ধীর মিথস্ক্রিয়া সনাক্তকরণের প্রক্রিয়ার মাধ্যমে এবং ল্যাব ডেটা ব্যবহার করে আপনাকে কারণগুলি সনাক্ত করতে এবং সেগুলিকে অপ্টিমাইজ করতে সহায়তা করার জন্য উপলব্ধ।

চেঞ্জলগ

মাঝে মাঝে, মেট্রিক্স পরিমাপ করতে ব্যবহৃত API-এ বাগগুলি আবিষ্কৃত হয়, এবং কখনও কখনও মেট্রিক্সের সংজ্ঞায়। ফলস্বরূপ, পরিবর্তনগুলি কখনও কখনও করা আবশ্যক, এবং এই পরিবর্তনগুলি আপনার অভ্যন্তরীণ রিপোর্ট এবং ড্যাশবোর্ডে উন্নতি বা রিগ্রেশন হিসাবে দেখাতে পারে৷

এটি পরিচালনা করতে আপনাকে সাহায্য করার জন্য, এই মেট্রিক্সের বাস্তবায়ন বা সংজ্ঞার সমস্ত পরিবর্তন এই চেঞ্জলগে প্রদর্শিত হবে।

আপনার যদি এই মেট্রিক্সের জন্য প্রতিক্রিয়া থাকে, তাহলে ওয়েব-ভিটালস-ফিডব্যাক Google গ্রুপে তা প্রদান করুন।

আপনার জ্ঞান পরীক্ষা করুন

INP মেট্রিকের প্রাথমিক লক্ষ্য কি?

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

INP গণনার উদ্দেশ্যে নিম্নলিখিত মিথস্ক্রিয়া প্রকারের কোনটি পরিলক্ষিত হয়? (প্রযোজ্য সমস্ত নির্বাচন করুন।)

একটি মাউস দিয়ে ক্লিক করুন.
সঠিক!
একটি মাউস হুইল বা ট্র্যাকপ্যাড দিয়ে পৃষ্ঠাটি স্ক্রোল করা।
ভুল - INP স্ক্রোলিং বিবেচনা করে না
একটি টাচস্ক্রিনে ট্যাপ করা।
সঠিক!
উপাদানের উপর মাউস কার্সার ঘোরানো।
ভুল - INP হোভারিং বিবেচনা করে না
একটি কীবোর্ডে একটি কী টিপে।
সঠিক!
পৃষ্ঠায় জুম ইন বা আউট.
ভুল - INP জুমিং বিবেচনা করে না

INP-এর জন্য একটি মিথস্ক্রিয়াটির "বিলম্বতা" কীভাবে সংজ্ঞায়িত করা হয়?

একটি ইন্টারঅ্যাকশনের ইভেন্ট হ্যান্ডলারগুলিকে প্রক্রিয়া করার জন্য ব্রাউজারটির সময়ের পরিমাণ৷
ভুল - এটি শুধুমাত্র প্রক্রিয়াকরণের সময়কালের জন্য দায়ী, পরবর্তী ফ্রেমটি উপস্থাপন করতে ইনপুট বিলম্ব বা সময় নয়
একটি ভিজ্যুয়াল প্রতিক্রিয়া তৈরি করতে একটি পৃষ্ঠায় সমস্ত ইন্টারঅ্যাকশনের জন্য যে গড় সময় লাগে৷
ভুল - INP দীর্ঘতম ইন্টারঅ্যাকশনের উপর ফোকাস করে, গড় নয়
একটি ইন্টারঅ্যাকশনের সাথে যুক্ত ইভেন্ট হ্যান্ডলারগুলির প্রক্রিয়াকরণ শুরু করতে ব্রাউজারটির সময় লাগে৷
ভুল - এটি শুধুমাত্র ইনপুট বিলম্বের জন্য দায়ী, প্রক্রিয়াকরণ এবং রেন্ডারিং সময় নয়
মিথস্ক্রিয়া শুরু হওয়ার মুহূর্ত থেকে পরবর্তী ফ্রেমটি সম্পূর্ণরূপে উপস্থাপন করা হয়েছে।
সঠিক!

INP এবং FID এর মধ্যে পার্থক্য কি?

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

কোন পরিস্থিতিতে পেজস্পিড ইনসাইটসের মতো টুলে পৃষ্ঠার জন্য INP ডেটা অনুপলব্ধ হতে পারে?

পৃষ্ঠাটি একটি কাস্টম কর্মক্ষমতা পরিমাপ লাইব্রেরি ব্যবহার করছে যা INP ডেটার প্রতিবেদন করে না৷
ভুল - INP স্বয়ংক্রিয়ভাবে ওয়েব প্ল্যাটফর্ম APIs ব্যবহার করে পরিমাপ করা হয় এবং কাস্টম লাইব্রেরির মাধ্যমে তাদের কর্মক্ষমতা স্ব-প্রতিবেদনকারী পৃষ্ঠাগুলির উপর নির্ভর করে না।
CrUX ডেটাসেটে অর্থপূর্ণ INP মান গণনা করার জন্য Chrome ব্যবহারকারীদের কাছ থেকে পর্যাপ্ত ইন্টারঅ্যাকশন ডেটা নেই।
সঠিক!
ব্যবহারকারীরা শুধুমাত্র স্ক্রলিং এবং হোভারিংয়ের মাধ্যমে পৃষ্ঠার সাথে ইন্টারঅ্যাক্ট করেছেন, যা INP-এর জন্য বিবেচনা করা হয় না।
সঠিক!
পৃষ্ঠাটি একটি ফ্রেমওয়ার্ক ব্যবহার করে তৈরি করা হয়েছে যা স্বয়ংক্রিয়ভাবে INP-এর জন্য অপ্টিমাইজ করে, তাই এটির প্রতিবেদন করার প্রয়োজন নেই।
ভুল - ফ্রেমওয়ার্কগুলি INP-তে সাহায্য করতে পারে, কিন্তু মেট্রিক এখনও প্রাসঙ্গিক এবং ডেটা উপলব্ধ থাকলে রিপোর্ট করা হয়

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

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

✨ এই কুইজটি Gemini 1.5 দ্বারা তৈরি করা হয়েছে এবং মানুষের দ্বারা পর্যালোচনা করা হয়েছে৷ আপনার মতামত শেয়ার করুন