ক্রোম ১৫১-এ নতুন

র‍্যাচেল অ্যান্ড্রু

প্রকাশিত: ২৮ জুলাই, ২০২৬

ক্রোম ১৫১ এখন চালু হচ্ছে, এবং এই পোস্টে রিলিজটির কিছু প্রধান ফিচার তুলে ধরা হয়েছে। ক্রোম ১৫১-এর সম্পূর্ণ রিলিজ নোট পড়ুন।

এই রিলিজের উল্লেখযোগ্য দিকগুলো:

সক্ষমতা উপাদান: <usermedia> MVP

<usermedia> এলিমেন্টটি হলো Capability Elements স্যুটের সর্বশেষ সংযোজন, যা <geolocation> -এর পরে এসেছে। PEPC উদ্যোগের অংশ হিসেবে মূল <permission> প্রস্তাবনা থেকে এই পরিবর্তনটি ব্রাউজারকে বিভিন্ন হার্ডওয়্যার সক্ষমতার স্বতন্ত্র জটিলতা ও আচরণ আরও কার্যকরভাবে সামলাতে সাহায্য করে। যেখানে প্রাথমিক প্রস্তাবনাটি মূলত অনুমতি দেওয়া বা না দেওয়ার মতো পারমিশন স্টেট ব্যবস্থাপনার উপর মনোযোগ দিয়েছিল, সেখানে Capability Elements ডেটা মধ্যস্থতাকারী হিসেবে কাজ করে।

<geolocation> এলিমেন্টটি আপনার সাইটে একটি লোকেশন অবজেক্ট সরবরাহ করে, এবং <usermedia> ক্যামেরা ও মাইক্রোফোন ব্যবহারের সম্পূর্ণ প্রক্রিয়াটি পরিচালনা করে। এটি ব্যবহারকারীর অভিপ্রায় শনাক্ত করে, ব্রাউজার প্রম্পট পরিচালনা করে এবং অ্যাপ্লিকেশনটিতে MediaStream অবজেক্টটি পৌঁছে দেয়। এই পরিবর্তনের ফলে আলাদাভাবে getUserMedia() কল করার প্রয়োজন হয় না, বাস্তবায়ন সহজ হয় এবং ব্রাউজারের কাছে ব্যবহারকারীর অভিপ্রায়ের একটি নির্ভরযোগ্য সংকেত নিশ্চিত হয়।

<usermedia> HTML এলিমেন্টের পরিচিতি অংশে আরও জানুন।

ঘোষণামূলক শ্যাডো ডোম: shadowrootslotassignment অ্যাসাইনমেন্ট অ্যাট্রিবিউট

ক্রোম ১৫১-এ <template> এলিমেন্টের জন্য shadowrootslotassignment অ্যাট্রিবিউটের সমর্থন যোগ করা হয়েছে। এর মাধ্যমে আপনি সরাসরি আপনার HTML-এ ম্যানুয়াল স্লট অ্যাসাইনমেন্ট ব্যবহার করে ডিক্লারেটিভ শ্যাডো রুট তৈরি করতে পারবেন।

এখন পর্যন্ত, ম্যানুয়াল স্লট অ্যাসাইনমেন্ট শুধুমাত্র ইম্পারেটিভভাবে উপলব্ধ ছিল। এই আপডেটের মাধ্যমে, আপনি আপনার শ্যাডো রুট টেমপ্লেটে shadowrootslotassignment="manual" নির্দিষ্ট করতে পারবেন।

এই অ্যাট্রিবিউটটি named (যা ডিফল্ট আচরণ) এবং manual গ্রহণ করে এবং এটি HTMLTemplateElement এর shadowRootSlotAssignment প্রপার্টির মাধ্যমে প্রতিফলিত হয়। আরও বিস্তারিত জানতে, MDN-এ HTMLTemplateElement.shadowRootSlotAssignment-এর ডকুমেন্টেশন দেখুন।

এই অ্যাট্রিবিউটটি ইতিমধ্যে ফায়ারফক্স এবং সাফারি ২৭ বিটা-তে উপলব্ধ, তাই শীঘ্রই এটি বেসলাইন হিসেবেও নতুনভাবে উপলব্ধ হবে।

সফট নেভিগেশন এবং ইন্টারঅ্যাকশন পারফরম্যান্স মেট্রিক্স

ক্রোম ১৫১ দুটি নতুন PerformanceEntry টাইপ— soft-navigation এবং interaction-contentful-paint প্রবর্তনের মাধ্যমে ওয়েব পারফরম্যান্স টাইমলাইনকে প্রসারিত করেছে। এই এন্ট্রিগুলো ডেভেলপারদেরকে সিঙ্গেল-পেজ অ্যাপ্লিকেশন (SPA)-এ ইন্টারঅ্যাকশন-চালিত পারফরম্যান্স এবং ল্যাটেন্সি ট্র্যাক করতে সাহায্য করে, যা Largest Contentful Paint (LCP) এবং Interaction to Next Paint (INP)-এর মতো প্রতিষ্ঠিত Core Web Vitals মেট্রিকগুলোর উপর ভিত্তি করে তৈরি।

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

interaction-contentful-paint এন্ট্রিটি ব্যবহারকারীর ইন্টারঅ্যাকশনের মাধ্যমে পরিবর্তিত DOM অঞ্চলের মধ্যে নতুন `contentful paint`-এর সংখ্যা পরিমাপ করে। এটি ইন্টারঅ্যাকশন লোডিং লেটেন্সি সম্পর্কে স্পষ্ট ধারণা দেয়, এমনকি যখন কন্টেন্ট আপডেট fetch() রিকোয়েস্টের মতো অ্যাসিঙ্ক্রোনাস অপারেশনের উপর নির্ভর করে।

আপনি একটি PerformanceObserver ব্যবহার করে আপনার অ্যাপ্লিকেশনে এই নতুন এন্ট্রিগুলো পর্যবেক্ষণ করতে পারেন। নিচের কোড স্নিপেটটি সফট নেভিগেশন এন্ট্রিগুলোকে কনসোলে লগ করে—যার মধ্যে বাফার্ড অপশন ব্যবহার করে এই পৃষ্ঠার পূর্ববর্তী সফট নেভিগেশনগুলোও অন্তর্ভুক্ত রয়েছে:

const observer = new PerformanceObserver(console.log);
observer.observe({ type: "soft-navigation", buffered: true });

SPA নেভিগেশন বাস্তবায়ন এবং পরিমাপ সম্পর্কে আরও জানতে, Chrome for Developers-এ Soft navigations ডকুমেন্টেশনটি পড়ুন।

আরও পড়ুন

এখানে কেবল কিছু গুরুত্বপূর্ণ বিষয় তুলে ধরা হয়েছে। ক্রোম ১৫১-এর অতিরিক্ত পরিবর্তনগুলোর জন্য নিচের লিঙ্কগুলো দেখুন:

সাবস্ক্রাইব করুন

সর্বশেষ খবরাখবর পেতে Chrome Developers YouTube চ্যানেলটি সাবস্ক্রাইব করুন, এবং আমরা যখনই কোনো নতুন ভিডিও প্রকাশ করব, আপনি একটি ইমেল বিজ্ঞপ্তি পাবেন। অথবা নতুন আর্টিকেল এবং ব্লগ পোস্টের জন্য X বা LinkedIn-এ আমাদের অনুসরণ করুন।

ক্রোম ১৫২ প্রকাশিত হওয়া মাত্রই, ক্রোমে নতুন কী কী এসেছে তা জানাতে আমরা এখানেই থাকব!