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

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

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

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

জুন মাসে, Chrome 103 এবং Firefox 102 স্থিতিশীল হয়ে ওঠে।

স্ট্রীম এবং পঠনযোগ্য বাইট স্ট্রীম রূপান্তর

ফায়ারফক্স 102-এ ট্রান্সফর্ম স্ট্রিমগুলির জন্য সমর্থন অন্তর্ভুক্ত রয়েছে। এটি ReadableStream থেকে WritableStream এ পাইপিং সক্ষম করে, খণ্ডগুলিতে একটি রূপান্তর সম্পাদন করে। এই বৈশিষ্ট্যটি তিনটি ইঞ্জিনেই উপলভ্য হতে দেখে দারুণ লাগছে, এটি স্ট্রীমস সম্পর্কে জানার জন্য এটি একটি খুব ভাল সময়।

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

  • ক্রোম: 67।
  • প্রান্ত: 79।
  • ফায়ারফক্স: 102।
  • সাফারি: 14.1।

উৎস

পঠনযোগ্য বাইট স্ট্রীমগুলিও এখন Firefox 102-এ সমর্থিত, ReadableStreamBYOBReader ইন্টারফেসের সাথে একটি BYOB (আপনার নিজস্ব বাফার আনুন) রিডার সক্ষম করে৷ এটি বিকাশকারী দ্বারা সরবরাহ করা ডেটা স্ট্রিম করতে ব্যবহার করা যেতে পারে।

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

  • ক্রোম: 89।
  • প্রান্ত: 89।
  • ফায়ারফক্স: 102।
  • সাফারি: সমর্থিত নয়।

উৎস

স্থানীয়ভাবে ইনস্টল করা ফন্ট অ্যাক্সেস করুন

Chrome 103 স্থানীয় ফন্ট অ্যাক্সেস API অন্তর্ভুক্ত করে, যা ব্যবহারকারীর স্থানীয়ভাবে ইনস্টল করা ফন্টগুলিতে অ্যাক্সেসের অনুমতি দেয়। ডিভাইসে ইনস্টল করা ফন্টগুলিতে অ্যাক্সেসের অনুরোধ করার পরে, ইনস্টল করা ফন্টগুলির একটি অ্যারে পেতে window.queryLocalFonts() এ কল করুন।

const pickedFonts = await window.queryLocalFonts();
for (const fontData of pickedFonts) {
  console.log(fontData.postscriptName);
  console.log(fontData.fullName);
  console.log(fontData.family);
  console.log(fontData.style);
}

update মিডিয়া বৈশিষ্ট্য

Firefox 102 update মিডিয়া বৈশিষ্ট্য অন্তর্ভুক্ত করে। এটি রেন্ডার হয়ে গেলে আউটপুট ডিভাইস সামগ্রীর চেহারা পরিবর্তন করতে পারে কিনা তা জিজ্ঞাসা করতে ব্যবহৃত হয়।

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

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

উৎস

একটি নতুন HTTP স্ট্যাটাস কোড—103 প্রাথমিক ইঙ্গিত

Chrome 103 একটি নতুন স্ট্যাটাস কোড HTTP 103 Early Hints যোগ করে। যদি সার্ভার বা CDN জানে যে একটি পৃষ্ঠা লোড করার জন্য একটি নির্দিষ্ট সেট সাবরিসোর্স প্রয়োজন, তাহলে এটি ব্রাউজারকে উৎপত্তির সাথে পূর্ব সংযোগ করতে বা রিসোর্সগুলিকে প্রিলোড করার পরামর্শ দিতে পারে কারণ যে পৃষ্ঠার প্রয়োজন সেগুলি আসে৷ এর জন্য আপনার সার্ভার বা CDN-এ আপডেটের প্রয়োজন৷ বৈশিষ্ট্যের সুবিধা নিন, প্রারম্ভিক ইঙ্গিতগুলি সম্পর্কে আরও জানুন ।

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

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

এপ্রিলে নতুন বিটা ছিল Chrome 104 , Firefox 103 , এবং Safari 16 ।

পরিসর মিডিয়া প্রশ্নের জন্য নতুন বাক্য গঠন

Chrome 104-এ মিডিয়া কোয়েরি লেভেল 4 স্পেসিফিকেশন থেকে রেঞ্জ মিডিয়া কোয়েরির জন্য নতুন সিনট্যাক্স অন্তর্ভুক্ত রয়েছে। উদাহরণস্বরূপ, একটি মিডিয়া ক্যোয়ারী আগে এই মত লেখা:

@media (min-width: 400px) { … }

এখন এভাবে লেখা যায়:

@media (width >= 400px) { … }

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

  • ক্রোম: 104।
  • প্রান্ত: 104।
  • ফায়ারফক্স: 102।
  • সাফারি: 16.4.

উৎস

অঞ্চল ক্যাপচার API

ডেস্কটপে Chrome 104 এছাড়াও অঞ্চল ক্যাপচার API অন্তর্ভুক্ত করে। এটি শেয়ার করার আগে ক্যাপচার করা ভিডিও থেকে বিষয়বস্তু ক্রপ এবং অপসারণ সক্ষম করে।

Safari 16 ব্রাউজারে বেশ কিছু মূল বৈশিষ্ট্য নিয়ে আসে

Safari 16 সাফারি টিমের আরেকটি উত্তেজনাপূর্ণ রিলিজ বলে মনে হচ্ছে। এই রিলিজটি ইন্টারপ 2022- এ অন্তর্ভুক্ত অনেকগুলি বৈশিষ্ট্য যুক্ত করেছে, এই মধ্য-বছরের পয়েন্টে এত অবতরণ দেখতে পাওয়া দুর্দান্ত। আমি এখানে আমার প্রিয় কয়েকটি বৈশিষ্ট্য হাইলাইট করছি, তবে আরও জানতে রিলিজ নোটগুলি দেখুন।

অনেক ডেভেলপারের সাথে, আমি কন্টেইনার ক্যোয়ারিগুলির জন্য আকারের প্রশ্নগুলির সমর্থন দেখে সত্যিই উত্তেজিত, একটি বৈশিষ্ট্য যা বর্তমানে Chrome-এ একটি পতাকার পিছনে রয়েছে৷

এছাড়াও Safari 16-এ grid-template-columns এবং grid-template-rows জন্য subgrid মানের সমর্থন রয়েছে। এই বৈশিষ্ট্যটি ইতিমধ্যেই Firefox-এ এবং Chrome-এ বিকাশে রয়েছে এবং গ্রিড ট্র্যাক সাইজিং নেস্টেড গ্রিড দ্বারা উত্তরাধিকারসূত্রে প্রাপ্ত হতে সক্ষম করে৷

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

  • ক্রোম: 117।
  • প্রান্ত: 117।
  • ফায়ারফক্স: 71।
  • সাফারি: 16।

উৎস

এছাড়াও গ্রিড বিন্যাসের জন্য গ্রিড ট্র্যাক অ্যানিমেট করার ক্ষমতা।

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

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

showPicker() পদ্ধতি, তারিখ, সময়, রঙ এবং ফাইলগুলির জন্য একটি ব্রাউজার পিকার দেখানোর একটি ক্যানোনিকাল উপায় সক্ষম করে। আপনি তারিখ, সময়, রঙ এবং ফাইলগুলির জন্য একটি ব্রাউজার পিকার দেখাতে এই সম্পর্কে আরও জানতে পারেন৷

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

  • ক্রোম: 99।
  • প্রান্ত: 99।
  • ফায়ারফক্স: 101।
  • সাফারি: 16।

উৎস

প্রদর্শনের জন্য অ্যাক্সেসিবিলিটি সমস্যা display: contents সমাধান করা হয়েছে, এই দরকারী বৈশিষ্ট্যটিকে অ্যাক্সেসিবিলিটি ট্রি থেকে উপাদানগুলি সরিয়ে ফেলার বিপদ ছাড়াই ব্যবহার করা নিরাপদ করে তোলে৷

এই বিটা বৈশিষ্ট্যগুলি শীঘ্রই স্থিতিশীল ব্রাউজারগুলিতে অবতরণ করবে৷

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