নভেম্বরে ওয়েব প্ল্যাটফর্মে নতুন

2022 সালের নভেম্বরে স্থিতিশীল এবং বিটা ওয়েব ব্রাউজারে আসা কিছু আকর্ষণীয় বৈশিষ্ট্য আবিষ্কার করুন।

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

স্থিতিশীল ব্রাউজার রিলিজ

নভেম্বরে, ফায়ারফক্স 107 , এবং ক্রোম 108 স্থিতিশীল হয়ে ওঠে। ওয়েব প্ল্যাটফর্মের জন্য এর অর্থ কী তা একবার দেখে নেওয়া যাক।

Android-এ Chrome-এ লেআউট ভিউপোর্ট আচরণে একটি পরিবর্তন

যখন অন-স্ক্রীন কীবোর্ড দেখানো হয় তখন Android-এ Chrome 108 থেকে লেআউট ভিউপোর্ট কীভাবে আচরণ করে তাতে একটি পরিবর্তন রয়েছে। আরও জানতে Android-এ Chrome-এ আসছে ভিউপোর্ট রিসাইজ আচরণের পরিবর্তনের জন্য প্রস্তুতি নিন।

নতুন ভিউপোর্ট ইউনিট

এছাড়াও Chrome 108-এ নতুন CSS ভিউপোর্ট ইউনিট রয়েছে। এর মধ্যে রয়েছে ছোট ( svw , svh , svi , svb , svmin , svmax ), বড় ( lvw , lvh , lvi , lvb , lvmin , lvmax ), গতিশীল ( dvw , dvh , dvh , dvi , dvb , dvmin , dvmax , যৌক্তিক ( vi , vb ) একক। এই ইউনিটগুলি ইতিমধ্যেই ফায়ারফক্স এবং সাফারিতে প্রয়োগ করা হয়েছে, যার অর্থ এই ইউনিটগুলির জন্য আমাদের কাছে এখন তিনটি প্রধান ব্রাউজার ইঞ্জিন জুড়ে রয়েছে।

বড়, ছোট এবং গতিশীল ভিউপোর্ট ইউনিট পড়ুন।

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

  • ক্রোম: 108।
  • প্রান্ত: 108।
  • ফায়ারফক্স: 101।
  • সাফারি: 15.4.

contain-intrinsic-size শর্টহ্যান্ড CSS প্রপার্টি Firefox 107-এ সমর্থিত, লংহ্যান্ড contain-intrinsic-width , contain-intrinsic-height এবং যৌক্তিক বৈশিষ্ট্য contain-intrinsic-block-size এবং contain-intrinsic-inline-size ।

এগুলি একটি UI উপাদানের আকার নির্দিষ্ট করার জন্য প্রয়োগ করা হয় যা আকারের নিয়ন্ত্রণের বিষয়। এটি একটি ব্যবহারকারী এজেন্টকে একটি উপাদানের আকার নির্ধারণ করতে দেয় তার শিশু উপাদানগুলিকে রেন্ডার করার প্রয়োজন ছাড়াই৷ যখন একটি উপাদান আকার নিয়ন্ত্রণ সাপেক্ষে তারা দরকারী.

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

  • ক্রোম: 83।
  • প্রান্ত: 83।
  • ফায়ারফক্স: 107।
  • সাফারি: 17।

উৎস

CSS ফ্র্যাগমেন্টেশনের জন্য সমর্থন কীওয়ার্ড avoid

ক্রোম 108-এ CSS ফ্র্যাগমেন্টেশন বৈশিষ্ট্যগুলির avoid মানগুলির জন্য সমর্থন অন্তর্ভুক্ত রয়েছে break-before , break-after এবং প্রিন্ট করার সময় break-inside । এই মানটি ব্রাউজারকে বলে যে উপাদানটি প্রয়োগ করার আগে, পরে বা ভিতরে ভাঙা এড়াতে। উদাহরণস্বরূপ, নিম্নলিখিত CSS একটি পৃষ্ঠা বিরতিতে একটি চিত্র ভাঙ্গা এড়ায়।

figure {
    break-inside: avoid;
}

এই সংযোজন LayoutNG ব্যবহার করে প্রিন্ট সমর্থন অন্তর্ভুক্ত করার কারণে, এটি একটি আধুনিক, কম বগি অভিজ্ঞতা নিয়ে আসে। LayoutNG সম্পর্কে আরও জানুন ।

ফেডারেটেড শংসাপত্র ব্যবস্থাপনা API

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

বিটা ব্রাউজার রিলিজ

বিটা ব্রাউজার সংস্করণগুলি আপনাকে সেই জিনিসগুলির একটি পূর্বরূপ দেয় যা ব্রাউজারের পরবর্তী স্থিতিশীল সংস্করণে থাকবে৷ নতুন বৈশিষ্ট্যগুলি পরীক্ষা করার জন্য এটি একটি দুর্দান্ত সময়, বা অপসারণ, যা বিশ্ব এই প্রকাশ পাওয়ার আগে আপনার সাইটকে প্রভাবিত করতে পারে৷ রিলিজের তারিখগুলি যেখানে পড়ে সেই কারণে, এই মাসে একমাত্র নতুন বিটা হল Firefox 108 , Safari 16.2 বিটা এখনও চলছে৷

Firefox 108 <source> উপাদানের জন্য height এবং width বৈশিষ্ট্য সমর্থন করে, যখন এটি একটি <picture> উপাদানের শিশু হয়। এই বৈশিষ্ট্যগুলি একক ছাড়াই পূর্ণসংখ্যা হিসাবে পিক্সেলে চিত্রের উচ্চতা বা প্রস্থ গ্রহণ করে।

ফায়ারফক্সে কন্টেইনার প্রশ্নের বাস্তবায়ন চলছে। Firefox 108 বিটাতে layout.css.container-queries.enabled পতাকার পিছনে, আপনি কন্টেইনার কোয়েরির দৈর্ঘ্যের ইউনিটগুলি পাবেন— cqw , cqh , cqi , cqb , cqmin , cqmax । এগুলি একটি ক্যোয়ারী কন্টেইনারের আকারের সাথে সম্পর্কিত দৈর্ঘ্যের একক।

ওয়েব সিরিজের নতুন অংশ