লং অ্যানিমেশন ফ্রেম এপিআই (LoAF-উচ্চারিত Lo-Af) Chrome 123 থেকে পাঠানো হয়েছে এবং আমরা এখন আমাদের টুলিং এবং নির্দেশিকা আপডেট করেছি যাতে আপনি এই নতুন API-এর সবচেয়ে বেশি ব্যবহার করতে পারেন৷
LoAF web-vitals
জাভাস্ক্রিপ্ট লাইব্রেরিতে উপলব্ধ
ওয়েব-ভাইটাল জাভাস্ক্রিপ্ট লাইব্রেরির সংস্করণ 4-এ INP ইন্টারঅ্যাকশন সম্পর্কিত দীর্ঘ অ্যানিমেশন ফ্রেম (বা ফ্রেম) অন্তর্ভুক্ত রয়েছে যেমনটি ফাইন্ড গাইডে ফাইন্ড স্লো ইন্টারঅ্যাকশনে নথিভুক্ত করা হয়েছে যাতে কীভাবে LoAF-এর সুবিধা নেওয়া যায় সে সম্পর্কে তথ্য অন্তর্ভুক্ত করা যায় ।
Google I/O 2024-এ, আমরা INP টক ডিবাগ করার জন্য নতুন ক্ষেত্রের অন্তর্দৃষ্টিতে এই তথ্যটি উপস্থাপন করেছি, আপনার INP ইন্টারঅ্যাকশনকে ধীর করে অন্যান্য স্ক্রিপ্টগুলি সনাক্ত করতে LoAF ব্যবহার করা সহ।
লাইব্রেরিতে সরাসরি API একত্রিত করা RUM অংশীদারদের এই API ব্যবহার করে RUMVision এবং DebugBear- এর পছন্দগুলি সহ এই ডেটা প্রকাশ করতে দেয়। এটি অন্যান্য RUM প্রদানকারীদের জন্য একটি ওপেন-সোর্স রেফারেন্স বাস্তবায়নও প্রদান করে যা তাদের নিজস্ব পণ্যের দিকে তাকাচ্ছে।
LoAF ওয়েব ভাইটালস এক্সটেনশনে উপলব্ধ
আপনাকে INP ইন্টারঅ্যাকশন ডিবাগ করতে সাহায্য করার জন্য দীর্ঘ অ্যানিমেশন ফ্রেম ডেটা অন্তর্ভুক্ত করার জন্য ওয়েব ভাইটালস এক্সটেনশন আপডেট করা হয়েছে:
![ওয়েব ভাইটালস এক্সটেনশন কনসোল লগিং।](https://developer.chrome.com/static/blog/loaf-has-shipped/image/loaf-web-vitals-extension.png?hl=bn)
আপনার ইন্টারঅ্যাকশনের সময় অন্যান্য স্ক্রিপ্টগুলি কী চলছে তা দেখতে এটি কার্যকর, যা প্রায়শই বিলম্বের কারণ (বিশেষত ইনপুট বিলম্ব) কিন্তু এখন পর্যন্ত এক্সটেনশন ব্যবহার করার সময় নির্ণয় করা কঠিন ছিল।
LoAF ব্যবহার করার বিষয়ে আপডেট করা নির্দেশিকা
আমরা আমাদের প্রধান লং অ্যানিমেশন ফ্রেম এপিআই ডকুমেন্টেশনে আমাদের নির্দেশিকা আপডেট করেছি যাতে আপনি এই API এর সবচেয়ে বেশি ব্যবহার করতে পারেন।
![INP LoAF হাইলাইট করা সহ একটি পৃষ্ঠায় দীর্ঘ অ্যানিমেশন ফ্রেমের উদাহরণ।](https://developer.chrome.com/static/blog/loaf-has-shipped/image/loaf-inp.png?hl=bn)
এই নির্দেশিকাটি আমরা কীভাবে এই এপিআইকে ক্ষেত্রটিতে ব্যবহার করতে দেখেছি তার উপর ভিত্তি করে, উদাহরণস্বরূপ Taboola থেকে এই কেস স্টাডিতে । আমরা আরও অনেক কেস স্টাডি নিয়ে কাজ করছি এবং ভবিষ্যতে এই ধরনের আরও উদাহরণ প্রকাশের জন্য উন্মুখ।
উপরন্তু আমরা MDN এ API নথিভুক্ত করেছি।
উপসংহার
লং অ্যানিমেশন ফ্রেম API হল ওয়েব প্ল্যাটফর্মের একটি উত্তেজনাপূর্ণ সংযোজন এবং আমরা ইতিমধ্যেই দেখেছি যে অনেকগুলি সাইট এই API ব্যবহার করে তাদের সাইটগুলিকে উন্নত করার জন্য এমনকি এটির ট্রায়াল পর্বেও। আমরা এই API-কে ধন্যবাদ ওয়েবসাইটগুলিতে টুলিং এবং উন্নত প্রতিক্রিয়াশীলতায় API-এর ব্যাপক গ্রহণের জন্য উন্মুখ।
,লং অ্যানিমেশন ফ্রেম এপিআই (LoAF-উচ্চারিত Lo-Af) Chrome 123 থেকে পাঠানো হয়েছে এবং আমরা এখন আমাদের টুলিং এবং নির্দেশিকা আপডেট করেছি যাতে আপনি এই নতুন API-এর সবচেয়ে বেশি ব্যবহার করতে পারেন৷
LoAF web-vitals
জাভাস্ক্রিপ্ট লাইব্রেরিতে উপলব্ধ
ওয়েব-ভাইটাল জাভাস্ক্রিপ্ট লাইব্রেরির সংস্করণ 4-এ INP ইন্টারঅ্যাকশন সম্পর্কিত দীর্ঘ অ্যানিমেশন ফ্রেম (বা ফ্রেম) অন্তর্ভুক্ত রয়েছে যেমনটি ফাইন্ড গাইডে ফাইন্ড স্লো ইন্টারঅ্যাকশনে নথিভুক্ত করা হয়েছে যাতে কীভাবে LoAF-এর সুবিধা নেওয়া যায় সে সম্পর্কে তথ্য অন্তর্ভুক্ত করা যায় ।
Google I/O 2024-এ, আমরা INP টক ডিবাগ করার জন্য নতুন ক্ষেত্রের অন্তর্দৃষ্টিতে এই তথ্যটি উপস্থাপন করেছি, আপনার INP ইন্টারঅ্যাকশনকে ধীর করে অন্যান্য স্ক্রিপ্টগুলি সনাক্ত করতে LoAF ব্যবহার করা সহ।
লাইব্রেরিতে সরাসরি API একত্রিত করা RUM অংশীদারদের এই API ব্যবহার করে RUMVision এবং DebugBear- এর পছন্দগুলি সহ এই ডেটা প্রকাশ করতে দেয়। এটি অন্যান্য RUM প্রদানকারীদের জন্য একটি ওপেন-সোর্স রেফারেন্স বাস্তবায়নও প্রদান করে যা তাদের নিজস্ব পণ্যের দিকে তাকাচ্ছে।
LoAF ওয়েব ভাইটালস এক্সটেনশনে উপলব্ধ
আপনাকে INP ইন্টারঅ্যাকশন ডিবাগ করতে সাহায্য করার জন্য দীর্ঘ অ্যানিমেশন ফ্রেম ডেটা অন্তর্ভুক্ত করার জন্য ওয়েব ভাইটালস এক্সটেনশন আপডেট করা হয়েছে:
![ওয়েব ভাইটালস এক্সটেনশন কনসোল লগিং।](https://developer.chrome.com/static/blog/loaf-has-shipped/image/loaf-web-vitals-extension.png?hl=bn)
আপনার ইন্টারঅ্যাকশনের সময় অন্যান্য স্ক্রিপ্টগুলি কী চলছে তা দেখতে এটি কার্যকর, যা প্রায়শই বিলম্বের কারণ (বিশেষত ইনপুট বিলম্ব) কিন্তু এখন পর্যন্ত এক্সটেনশন ব্যবহার করার সময় নির্ণয় করা কঠিন ছিল।
LoAF ব্যবহার করার বিষয়ে আপডেট করা নির্দেশিকা
আমরা আমাদের প্রধান লং অ্যানিমেশন ফ্রেম এপিআই ডকুমেন্টেশনে আমাদের নির্দেশিকা আপডেট করেছি যাতে আপনি এই API এর সবচেয়ে বেশি ব্যবহার করতে পারেন।
![INP LoAF হাইলাইট করা সহ একটি পৃষ্ঠায় দীর্ঘ অ্যানিমেশন ফ্রেমের উদাহরণ।](https://developer.chrome.com/static/blog/loaf-has-shipped/image/loaf-inp.png?hl=bn)
এই নির্দেশিকাটি আমরা কীভাবে এই এপিআইকে ক্ষেত্রটিতে ব্যবহার করতে দেখেছি তার উপর ভিত্তি করে, উদাহরণস্বরূপ Taboola থেকে এই কেস স্টাডিতে । আমরা আরও অনেক কেস স্টাডি নিয়ে কাজ করছি এবং ভবিষ্যতে এই ধরনের আরও উদাহরণ প্রকাশের জন্য উন্মুখ।
উপরন্তু আমরা MDN এ API নথিভুক্ত করেছি।
উপসংহার
লং অ্যানিমেশন ফ্রেম API হল ওয়েব প্ল্যাটফর্মের একটি উত্তেজনাপূর্ণ সংযোজন এবং আমরা ইতিমধ্যেই দেখেছি যে অনেকগুলি সাইট এই API ব্যবহার করে তাদের সাইটগুলিকে উন্নত করার জন্য এমনকি এটির ট্রায়াল পর্বেও। আমরা এই API-কে ধন্যবাদ ওয়েবসাইটগুলিতে টুলিং এবং উন্নত প্রতিক্রিয়াশীলতায় API-এর ব্যাপক গ্রহণের জন্য উন্মুখ।