2024 সালের মে মাসে স্থিতিশীল এবং বিটা ওয়েব ব্রাউজারে আসা কিছু আকর্ষণীয় বৈশিষ্ট্য আবিষ্কার করুন।
স্থিতিশীল ব্রাউজার রিলিজ
2024 সালের মে মাসে Firefox 126 , Safari 17.5 , এবং Chrome 125 স্থিতিশীল হয়ে ওঠে। এই পোস্টটি ওয়েব প্ল্যাটফর্মে যোগ করা নতুন বৈশিষ্ট্যগুলি দেখে।
CSS অ্যাঙ্কর পজিশনিং
Chrome 125-এ CSS অ্যাঙ্কর পজিশনিং অন্তর্ভুক্ত। এটি আপনাকে জাভাস্ক্রিপ্ট ব্যবহার না করেই একটি ঘোষণামূলক উপায়ে পৃষ্ঠার এক বা একাধিক অন্যান্য উপাদানের (অ্যাঙ্কর) সাথে একটি সম্পূর্ণ অবস্থানে থাকা উপাদানকে সংযুক্ত করতে দেয়। অ্যাঙ্কর পজিশনিং কার্যকরীভাবে কাজ করে যখন অ্যাঙ্করগুলি স্ক্রোলযোগ্য হয়। একটি সাধারণ ব্যবহারের ক্ষেত্রে একটি পপওভার স্থাপন করা হয় যেমন যে উপাদানটি এটিকে আহ্বান করেছে তার পাশে একটি টুলটিপ বা একটি নির্বাচন করা মেনু এবং তার পপওভার বিকল্প তালিকা।
CSS অ্যাঙ্কর পজিশনিং এপিআই প্রবর্তন করে আরও জানুন।
CSS স্টেপড ভ্যালু ফাংশন- round() , mod() , এবং rem()
Chrome 125-এ স্টেপড ভ্যালু ফাংশনও রয়েছে, যার মানে এই ফাংশনগুলি এখন বেসলাইন নতুনভাবে উপলব্ধ৷ স্টেপড ভ্যালু ফাংশন, round() , mod() , এবং rem() , সমস্ত একটি প্রদত্ত মানকে অন্য একটি "পদক্ষেপ মান" অনুযায়ী রূপান্তরিত করে।
CSS স্টেপড ভ্যালু ম্যাথ ফাংশনগুলি এখন বেসলাইন 2024-এ আরও আবিষ্কার করুন।
light-dark() ফাংশন
এছাড়াও নতুনভাবে উপলব্ধ বেসলাইনে যোগদান হল CSS কালার ফাংশন light-dark() , যা Safari 17.5 এ রয়েছে।
light-dark() হল একটি ফাংশন যা দুটি আর্গুমেন্ট গ্রহণ করে, উভয়কেই একটি <color> হতে হবে। ব্যবহৃত রঙের স্কিমের উপর নির্ভর করে উভয়ের মধ্যে একটি বাছাই করা হয়।
- যদি ব্যবহৃত রঙের স্কিমটি
lightবা অজানা হয় তবে প্রথম মানের গণনাকৃত মানটি ফেরত পাবে। - যদি ব্যবহৃত রঙের স্কিমটি
darkহয় তবে দ্বিতীয় রঙের গণনাকৃত মান ফেরত দেওয়া হয়।
আলো-অন্ধকার() সহ CSS রঙ-স্কিম-নির্ভর রঙগুলিতে আরও পড়ুন।
স্ক্রিন ওয়েক লক এপিআই
ফায়ারফক্স 126-এ ল্যান্ডিং হল স্ক্রিন ওয়েক লক এপিআই, আরেকটি বৈশিষ্ট্য যা এখন নতুনভাবে উপলব্ধ বেসলাইনের অংশ। এই API ডিভাইসটিকে আবছা এবং স্ক্রীন লক করা থেকে আটকানোর একটি উপায় প্রদান করে৷
স্ক্রীন ওয়েক লক এপিআই-এর সাথে জেগে থাকুন এই বৈশিষ্ট্যটি কীভাবে ব্যবহার করবেন তা খুঁজে বের করুন।
কম্পিউট প্রেসার API
কম্পিউট প্রেসার এপিআই উচ্চ-স্তরের অবস্থা অফার করে যা সিস্টেমে CPU লোডকে প্রতিনিধিত্ব করে। এটি বাস্তবায়নকে সঠিক অন্তর্নিহিত হার্ডওয়্যার মেট্রিকগুলি ব্যবহার করার অনুমতি দেয় যাতে ব্যবহারকারীরা তাদের কাছে উপলব্ধ সমস্ত প্রক্রিয়াকরণ শক্তির সুবিধা নিতে পারে যতক্ষণ না সিস্টেমটি নিয়ন্ত্রণযোগ্য চাপের মধ্যে না থাকে।
এই বৈশিষ্ট্যটি ক্রোম 125-এ রয়েছে। ইন্টেল এই API-এর জন্য ডিজাইন এবং বাস্তবায়ন কাজের নেতৃত্ব দিয়েছে, যা ভিডিও কনফারেন্সিং অ্যাপগুলিকে গতিশীলভাবে বৈশিষ্ট্য এবং কর্মক্ষমতা ভারসাম্য করতে দেবে।
কম্পিউট প্রেসার API এর জন্য ডকুমেন্টেশন পড়ুন।
@starting-style নিয়ম
সাফারি 17.5-এ @starting-style নিয়ম রয়েছে। এই CSS অ্যাট-রুল আপনাকে একটি স্টাইল প্রয়োগ করতে দেয় যা এন্ট্রি অ্যানিমেশনের জন্য প্রয়োজন অনুসারে পৃষ্ঠায় উপাদানটি খোলার আগে ব্রাউজারটি দেখতে পারে।
মসৃণ এন্ট্রি এবং এক্সিট অ্যানিমেশনের জন্য চারটি নতুন CSS বৈশিষ্ট্যের অন্তর্ভুক্ত বৈশিষ্ট্যগুলির মধ্যে একটি হল @starting-style নিয়ম।
বিটা ব্রাউজার রিলিজ
বিটা ব্রাউজার সংস্করণগুলি আপনাকে সেই জিনিসগুলির একটি পূর্বরূপ দেয় যা ব্রাউজারের পরবর্তী স্থিতিশীল সংস্করণে থাকবে৷ নতুন বৈশিষ্ট্যগুলি পরীক্ষা করার জন্য এটি একটি দুর্দান্ত সময়, বা অপসারণ, যা বিশ্ব এই প্রকাশ পাওয়ার আগে আপনার সাইটকে প্রভাবিত করতে পারে৷ নতুন বিটা হল Firefox 127 এবং Chrome 126 । এই প্রকাশগুলি প্ল্যাটফর্মে অনেক দুর্দান্ত বৈশিষ্ট্য নিয়ে আসে। সমস্ত বিবরণের জন্য রিলিজ নোটগুলি দেখুন। এখানে মাত্র কয়েকটি হাইলাইট রয়েছে।
Chrome 126 একই মূল নেভিগেশনের জন্য ক্রস-ডকুমেন্ট ভিউ ট্রানজিশন অন্তর্ভুক্ত করে। পূর্বে আপনাকে ভিউ ট্রানজিশন API ব্যবহার করার জন্য আপনার ওয়েবসাইটটিকে একটি SPA-তে পুনর্নির্মাণ করতে হয়েছিল। এই এখন আর তা নেই। একই-অরিজিন নেভিগেশনের জন্য রূপান্তর দেখুন ডিফল্টরূপে সক্রিয় করা হয়েছে। আপনি দুটি ভিন্ন নথির মধ্যে একটি ভিউ ট্রানজিশন তৈরি করতে পারেন যা একই-অরিজিন।
ফায়ারফক্স 127-এ অতিরিক্ত জাভাস্ক্রিপ্ট সেট পদ্ধতি রয়েছে- intersection() , union() , difference() , symmetricDifference() , isSubsetOf() , isSupersetOf() , এবং isDisjointFrom() ।