CrUX-এর মেট্রিকগুলি ব্রাউজার দ্বারা উন্মুক্ত স্ট্যান্ডার্ড ওয়েব প্ল্যাটফর্ম API দ্বারা চালিত হয়। বিশেষ করে BigQuery ডেটাসেটে, এই ডেটা অরিজিন-রেজোলিউশনে একত্রিত করা হয়। সাইটের মালিকদের আরও বিস্তারিত (যেমন ইউআরএল-লেভেল রেজোলিউশন) বিশ্লেষণ এবং তাদের সাইটের পারফরম্যান্সের অন্তর্দৃষ্টি প্রয়োজন তারা তাদের নিজস্ব উত্সের জন্য বিশদ বাস্তব ব্যবহারকারী পরিমাপ (RUM) ডেটা সংগ্রহ করতে একই API ব্যবহার করতে পারে। মনে রাখবেন যে সমস্ত API গুলি Chrome-এ উপলব্ধ থাকলেও অন্যান্য ব্রাউজারগুলি মেট্রিক্সের সম্পূর্ণ সেট সমর্থন নাও করতে পারে৷
বেশিরভাগ মেট্রিকগুলিকে হিস্টোগ্রাম একত্রীকরণ হিসাবে উপস্থাপন করা হয়, যা বন্টন এবং শতকরা মানগুলির আনুমানিক দৃশ্যায়নের অনুমতি দেয়।
ক্রমবর্ধমান লেআউট শিফট
"Cumulative Layout Shift (CLS) হল ভিজ্যুয়াল স্থিতিশীলতা পরিমাপের জন্য একটি গুরুত্বপূর্ণ, ব্যবহারকারী-কেন্দ্রিক মেট্রিক কারণ এটি ব্যবহারকারীরা কত ঘন ঘন অপ্রত্যাশিত লেআউট পরিবর্তনের অভিজ্ঞতা লাভ করে তা পরিমাপ করতে সাহায্য করে - একটি কম CLS নিশ্চিত করতে সাহায্য করে যে পৃষ্ঠাটি আনন্দদায়ক।"
DOM সামগ্রী লোড হয়েছে৷
"DOMContentLoaded সেই সময়টি রিপোর্ট করে যখন প্রাথমিক HTML নথিটি সম্পূর্ণরূপে লোড এবং পার্স করা হয়, স্টাইলশীট, চিত্র এবং সাবফ্রেম লোডিং শেষ করার জন্য অপেক্ষা না করে।"
প্রথম পেইন্ট
"প্রথম পেইন্ট সেই সময়টি রিপোর্ট করে যখন ব্রাউজারটি নেভিগেশনের পরে প্রথম রেন্ডার করেছিল৷ এটি ডিফল্ট ব্যাকগ্রাউন্ড পেইন্টটি বাদ দেয়, কিন্তু অ-ডিফল্ট ব্যাকগ্রাউন্ড পেইন্ট অন্তর্ভুক্ত করে৷ এটিই প্রথম মূল মুহূর্ত যা বিকাশকারীরা পৃষ্ঠা লোডের ক্ষেত্রে যত্নশীল - যখন ব্রাউজারটি পৃষ্ঠাটি রেন্ডার করা শুরু করে৷"
প্রথম কনটেন্টফুল পেইন্ট
"ফার্স্ট কনটেন্টফুল পেইন্ট (এফসিপি) সেই সময়টি রিপোর্ট করে যখন ব্রাউজারটি প্রথম কোনো পাঠ্য, ছবি (পটভূমির ছবি সহ), অ-সাদা ক্যানভাস বা এসভিজি রেন্ডার করে। এতে মুলতুবি থাকা ওয়েবফন্টগুলির সাথে পাঠ্য অন্তর্ভুক্ত রয়েছে। এই প্রথমবার ব্যবহারকারীরা পৃষ্ঠার সামগ্রী ব্যবহার করা শুরু করতে পারে।"
নেক্সট পেইন্টের সাথে মিথস্ক্রিয়া
"নেক্সট পেইন্টের সাথে ইন্টারঅ্যাকশন (INP) হল একটি ফিল্ড মেট্রিক যা প্রতিক্রিয়াশীলতার মূল্যায়ন করে। INP সমগ্র পৃষ্ঠার লাইফসাইকেল জুড়ে সমস্ত ইন্টারঅ্যাকশনের লেটেন্সি লগ করে। সেই ইন্টারঅ্যাকশনের সর্বোচ্চ মান-অথবা অনেকগুলি ইন্টারঅ্যাকশন সহ পৃষ্ঠাগুলির জন্য সর্বোচ্চের কাছাকাছি-পৃষ্ঠার INP হিসাবে রেকর্ড করা হয়। একটি কম INP নিশ্চিত করে যে পৃষ্ঠাটি সমস্ত সময়ে পুনরায় প্রতিক্রিয়াশীল হবে।"
নেক্সট পেইন্টের সাথে ইন্টারঅ্যাকশন (INP) ফেব্রুয়ারি 2022- এ CrUX ডেটাসেটে যোগ করা হয়েছিল। এই নতুন মেট্রিকটি স্বতন্ত্র ইভেন্টের শেষ-থেকে-শেষ লেটেন্সি ক্যাপচার করে এবং একটি পৃষ্ঠার সারাজীবনের সামগ্রিক প্রতিক্রিয়াশীলতার আরও সামগ্রিক চিত্র অফার করে।
সবচেয়ে বড় বিষয়বস্তু পেইন্ট
"লার্জেস্ট কনটেন্টফুল পেইন্ট (LCP) একটি গুরুত্বপূর্ণ, অনুভূত লোডের গতি পরিমাপের জন্য ব্যবহারকারী-কেন্দ্রিক মেট্রিক কারণ এটি পৃষ্ঠার প্রধান বিষয়বস্তু সম্ভবত লোড হওয়ার সময় পৃষ্ঠা লোডের টাইমলাইনে বিন্দুটিকে চিহ্নিত করে — একটি দ্রুত LCP ব্যবহারকারীকে আশ্বস্ত করতে সাহায্য করে যে পৃষ্ঠাটি দরকারী।"
সবচেয়ে বড় বিষয়বস্তুপূর্ণ পেইন্ট রিসোর্স টাইপ
"এলসিপি ভিউপোর্টে দৃশ্যমান সবচেয়ে বড় ইমেজ, টেক্সট ব্লক বা ভিডিওর রেন্ডার টাইম রিপোর্ট করে, যখন ব্যবহারকারী প্রথম পৃষ্ঠায় নেভিগেট করেছিল তার সাথে সম্পর্কিত।"
web.dev/articles/lcp - এলসিপি-এর জন্য কোন উপাদান বিবেচনা করা হয়
টেক্সট এবং ইমেজ (প্রথম ভিডিও ফ্রেম ইমেজ সহ) প্রায়ই খুব ভিন্ন লোডিং বৈশিষ্ট্য এবং অপ্টিমাইজেশান কৌশল আছে। LCP রিসোর্সের প্রকারের অনুপাত বোঝার ফলে আপনি আপনার LCP মেট্রিক্স এবং অপ্টিমাইজেশন পাথগুলি আরও ভালভাবে বুঝতে পারবেন।
আরও তথ্যের জন্য দেখুন LCP রিসোর্স প্রকার লঞ্চ ব্লগ পোস্ট ।
সবচেয়ে বড় বিষয়বস্তুপূর্ণ পেইন্ট ইমেজ subparts
"LCP-এর জন্য অপ্টিমাইজ করা আরও জটিল কাজ হতে পারে যখন PageSpeed Insights আপনাকে এই মেট্রিকটি কীভাবে উন্নত করতে হয় তার উত্তর দেয় না। জটিল কাজগুলির সাথে সাধারণত সেগুলিকে ছোট, আরও পরিচালনাযোগ্য কাজগুলিতে বিভক্ত করা এবং প্রতিটিকে আলাদাভাবে সম্বোধন করা ভাল।"
web.dev/articles/optimize-lcp - সাবপার্টে LCP ভাঙ্গন
ইমেজ এলসিপিগুলিকে এর সবচেয়ে গুরুত্বপূর্ণ সাবপার্টে ভাঙ্গিয়ে প্রতিটি অংশকে কীভাবে অপ্টিমাইজ করা যায় তার জন্য নির্দিষ্ট সুপারিশ এবং সর্বোত্তম অনুশীলনগুলি ব্যবহার করার ক্ষমতা প্রদান করে।
এলসিপি ইমেজ সাবপার্টগুলি চারটি পৃথক মেট্রিক্সে সরবরাহ করা হয়েছে:
-
largest_contentful_paint_image_time_to_first_byte -
largest_contentful_paint_image_resource_load_delay -
largest_contentful_paint_image_resource_load_duration -
largest_contentful_paint_image_element_render_delay
সাবপার্টগুলি শুধুমাত্র চিত্রগুলির জন্য অন্তর্ভুক্ত করা হয়েছে এবং এতে প্রথম ভিডিও ফ্রেম চিত্রগুলি অন্তর্ভুক্ত নয় কারণ সেগুলি একটু বেশি জটিল কারণ আমরা সম্পূর্ণ ডাউনলোডের সময় পরিমাপ করতে পারি না (মনে রাখবেন প্রথম ভিডিও ফ্রেমগুলি LCP রিসোর্স টাইপ মেট্রিকে অন্তর্ভুক্ত করা হয়েছে, যেখানে সেই জটিলতাটি প্রাসঙ্গিক নয়)৷
টেক্সট সাবপার্টগুলিও অন্তর্ভুক্ত করা হয় না কারণ সেগুলি কম দরকারী এবং ইমেজ LCPs নম্বরগুলিকে বিকৃত করবে। যে সাইটগুলি মূলত টেক্সট এলসিপি দিয়ে তৈরি তাদের জন্য সামগ্রিক TTFB এবং সামগ্রিক FCP মেট্রিকগুলি দরকারী ব্রেকডাউন-যদিও নোট করুন যেগুলি সমস্ত এলসিপি জুড়ে এবং পাঠ্য এলসিপিগুলির জন্য নির্দিষ্ট নয়৷
আরও তথ্যের জন্য দেখুন এলসিপি ইমেজ সাবপার্টস লঞ্চ ব্লগ পোস্ট ।
নেভিগেশন প্রকার
নেভিগেশন প্রকারের মেট্রিক নিম্নলিখিত নেভিগেশনগুলির পৃষ্ঠা দর্শনের শতাংশের একটি ভাঙ্গন প্রদান করে:
| টাইপ | বর্ণনা |
|---|---|
navigate | একটি পৃষ্ঠা লোড, যা অন্য কোনো বিভাগের সাথে খাপ খায় না। |
navigate_cache | একটি পৃষ্ঠা লোড যার জন্য প্রধান সংস্থান (মূল HTML নথি) HTTP ক্যাশে থেকে পরিবেশন করা হয়েছিল৷ সাইটগুলি প্রায়শই সাব-রিসোর্সগুলির জন্য ক্যাশিং ব্যবহার করে, কিন্তু প্রধান HTML নথি প্রায়শই যথেষ্ট কম ক্যাশে করা হয় এবং যখন এটি হতে পারে, তখন এটি স্থানীয়ভাবে এবং একটি CDN-এ ক্যাশে করা সক্ষম হওয়া থেকে লক্ষণীয় কার্যক্ষমতার উন্নতি ঘটাতে পারে। |
reload | ব্যবহারকারী পৃষ্ঠাটি পুনরায় লোড করেছে, হয় পুনরায় লোড বোতাম টিপে, ঠিকানা বারে এন্টার টিপে, অথবা একটি ট্যাব বন্ধ পূর্বাবস্থায় ফিরিয়ে আনার মাধ্যমে। পৃষ্ঠা পুনরায় লোড করার ফলে প্রধান পৃষ্ঠা পরিবর্তিত হয়েছে কিনা তা পরীক্ষা করার জন্য সার্ভারে পুনরায় যাচাই করা হয়। পৃষ্ঠা পুনরায় লোডের একটি উচ্চ শতাংশ ব্যবহারকারীর অভিজ্ঞতা হতাশা নির্দেশ করতে পারে। |
restore | একটি ব্রাউজার পুনরায় চালু করার পরে পৃষ্ঠাটি পুনরায় লোড করা হয়েছিল, বা একটি ট্যাব যা মেমরির কারণে সরানো হয়েছে৷ Android-এ Chrome-এর জন্য এর পরিবর্তে 'রিলোড' হিসেবে রিপোর্ট করা হয়েছে। |
back_forward | একটি ইতিহাস নেভিগেশন, যার অর্থ পৃষ্ঠাটি দেখা হয়েছে এবং সম্প্রতি ফিরে এসেছে৷ সঠিক ক্যাশিংয়ের সাথে, এগুলি যুক্তিসঙ্গতভাবে দ্রুত অভিজ্ঞতা হওয়া উচিত তবে এখনও পৃষ্ঠাটি প্রক্রিয়াকরণ করা এবং জাভাস্ক্রিপ্ট কার্যকর করা প্রয়োজন - উভয়ই bfcache এড়িয়ে যায়। |
back_forward_cache | একটি ইতিহাস নেভিগেশন যা bfcache থেকে পরিবেশিত হয়েছিল। ব্লকারগুলি সরিয়ে বিএফক্যাশের সুবিধা নিতে আপনার পৃষ্ঠাগুলিকে অপ্টিমাইজ করার ফলে দ্রুত অভিজ্ঞতা পাওয়া উচিত, তাই সাইটগুলি দেখতে হবে |
prerender | পৃষ্ঠাটি প্রি-রেন্ডার করা হয়েছিল যা-bfcache-এর মতোই-এর ফলে কাছাকাছি-তাত্ক্ষণিক পৃষ্ঠা লোড হতে পারে। |
কিছু ক্ষেত্রে, একটি পৃষ্ঠা লোড একাধিক নেভিগেশন প্রকারের সংমিশ্রণ হতে পারে। সেক্ষেত্রে, CrUX টেবিলের বিপরীত ক্রমে (নীচ থেকে উপরে) প্রথম ম্যাচ রিপোর্ট করে।
আরও তথ্য নেভিগেশন প্রকারের ঘোষণা পোস্টে পাওয়া যাবে।
অনলোড
"পৃষ্ঠা এবং এর নির্ভরশীল সংস্থানগুলি লোড করা শেষ হলে লোড ইভেন্টটি চালু করা হয়।"
রাউন্ড ট্রিপ সময়
সাম্প্রতিক নেটওয়ার্ক সংযোগের উপর ভিত্তি করে, নেভিগেশনের শুরুতে HTTP (অ্যাপ্লিকেশন স্তর) রাউন্ড ট্রিপ সময়ের একটি অনুমান প্রদান করে। এই মেট্রিকটি নেটওয়ার্ক ইনফরমেশন API এর rtt প্রপার্টির উপর ভিত্তি করে তৈরি করা হয়েছে, যেটি আগের কার্যকরী সংযোগ প্রকার (ECT) মাত্রার জন্য দায়ী একই API।
আরও তথ্যের জন্য দেখুন LCP রিসোর্স প্রকার লঞ্চ ব্লগ পোস্ট ।
পরীক্ষামূলক মেট্রিক্স
পরীক্ষামূলক মেট্রিক্স BigQuery ব্যবহার করে CrUX ডেটাসেটে উপলব্ধ, কিছু CrUX API- তেও উপলব্ধ। ব্যবহারকারীর প্রতিক্রিয়ার উপর ভিত্তি করে এই মেট্রিকগুলি নিয়মিতভাবে পরিবর্তিত হতে পারে। সাম্প্রতিক পরিবর্তনগুলি সম্পর্কে আপ টু ডেট রাখতে রিলিজ নোটগুলি পরীক্ষা করুন৷
প্রথম বাইট করার সময়
CrUX-এ TTFB শুধুমাত্র সম্পূর্ণ পৃষ্ঠা লোডের সময় সংগ্রহ করা হয়, অন্যান্য টাইমার (যেমন LCP ) থেকে ভিন্ন যা ব্যাক-ফরোয়ার্ড নেভিগেশন এবং প্রি-রেন্ডার করা পৃষ্ঠাগুলিতেও সংগ্রহ করা হয়। যেমন, TTFB-এর নমুনার আকার অন্যান্য মেট্রিক্সের তুলনায় ছোট হতে পারে এবং অগত্যা তাদের সাথে সরাসরি তুলনা করা যাবে না।
TTFB সার্ভারের প্রতিক্রিয়া সময়ের একটি সরাসরি পরিমাপ নয় কারণ এতে এর আগে পরিমাপ অন্তর্ভুক্ত থাকে, পুনঃনির্দেশিত সময় সহ এবং প্রতিক্রিয়া ক্যাশে বা CDN বা সার্ভার থেকে দেওয়া হয় কিনা তা দ্বারা প্রভাবিত হয়। এটি বিশেষ করে CrUX-এর মতো ফিল্ড ডেটাতে স্পষ্ট, যেখানে ল্যাব টেস্টিং সাধারণত এই কারণগুলির দ্বারা কম প্রভাবিত হয় যেহেতু শেষ URLটি পরীক্ষা এবং প্রায়শই বারবার ক্যাশিং পরিবর্তনগুলিকে অস্বীকার করে৷
জনপ্রিয়তা
জনপ্রিয়তা র্যাঙ্ক মেট্রিক হল CrUX ডেটাসেটের মধ্যে সাইটের জনপ্রিয়তার একটি আপেক্ষিক পরিমাপ, যা মূলে নেভিগেশনের মোট সংখ্যা দ্বারা পরিমাপ করা হয়। র্যাঙ্কটি log10 স্কেলে অর্ধেক ধাপ সহ (যেমন শীর্ষ 1k, শীর্ষ 5k, শীর্ষ 10k, শীর্ষ 50k, শীর্ষ 100k, শীর্ষ 500k, শীর্ষ 1M, ইত্যাদি) পূর্ববর্তীটি বাদ দিয়ে প্রতিটি র্যাঙ্ক (যেমন শীর্ষ 5k আসলে 4k URL, শীর্ষ 1k ব্যতীত)। ডেটাসেট বাড়ার সাথে সাথে উপরের সীমাটি গতিশীল।
জনপ্রিয়তা বিস্তৃত বিশ্লেষণের জন্য একটি নির্দেশিকা হিসাবে প্রদান করা হয়, উদাহরণস্বরূপ শীর্ষ 1,000 উত্সের জন্য দেশ অনুসারে কর্মক্ষমতা নির্ধারণ করা।
বিজ্ঞপ্তি অনুমতি
যে ওয়েবসাইটগুলি ব্যবহারকারীদের বিজ্ঞপ্তিগুলি দেখানোর অনুমতির জন্য অনুরোধ করে, এই মেট্রিক প্রম্পটে ব্যবহারকারীদের প্রতিক্রিয়াগুলির আপেক্ষিক ফ্রিকোয়েন্সি প্রতিনিধিত্ব করে: গ্রহণ, অস্বীকার, উপেক্ষা বা খারিজ।