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

২০২৫ সালের অক্টোবর মাসে স্থিতিশীল এবং বিটা ওয়েব ব্রাউজারগুলিতে আসা কিছু আকর্ষণীয় বৈশিষ্ট্য আবিষ্কার করুন।

প্রকাশিত: ৩০ অক্টোবর, ২০২৫

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

অক্টোবর মাসে ক্রোম ১৪২ এবং ফায়ারফক্স ১৪৪ স্থিতিশীল অবস্থায় প্রকাশিত হয়েছে, এই পোস্টে ওয়েব প্ল্যাটফর্মের জন্য এর অর্থ কী তা একবার দেখে নেওয়া হয়েছে।

একক-পৃষ্ঠার অ্যাপের জন্য ভিউ ট্রানজিশন API

ফায়ারফক্স ১৪৪-এ একই-ডকুমেন্ট ভিউ ট্রানজিশনের জন্য সমর্থন রয়েছে। এর মধ্যে রয়েছে:

  • :active-view-transition ছদ্ম-শ্রেণী
  • view-transition-class প্রোপার্টি
  • view-transition-name বৈশিষ্ট্য
  • ::view-transition ছদ্ম-উপাদান
  • ::view-transition-group() ছদ্ম-উপাদান
  • ::view-transition-image-pair() ছদ্ম-উপাদান
  • ::view-transition-new() ছদ্ম-উপাদান
  • ::view-transition-old() ছদ্ম-উপাদান

এটি একই-নথির দৃশ্য রূপান্তরগুলিকে বেসলাইন নতুনভাবে উপলব্ধ করে তোলে।

Browser Support

  • ক্রোম: ১২৫।
  • প্রান্ত: ১২৫।
  • ফায়ারফক্স: ১৪৪।
  • সাফারি: ১৮টি।

Source

<button> এলিমেন্টে command এবং commandfor অ্যাট্রিবিউট

Firefox 144 command এবং commandfor সমর্থন করে। আপনি command এবং commandfor সাথে পরিচিতি বিভাগে এই বৈশিষ্ট্যগুলি সম্পর্কে আরও জানতে পারেন।

Browser Support

  • ক্রোম: ১৩৫।
  • প্রান্ত: ১৩৫।
  • ফায়ারফক্স: ১৪৪।
  • সাফারি প্রযুক্তি পূর্বরূপ: সমর্থিত।

moveBefore() পদ্ধতি

moveBefore() পদ্ধতিটি এখন Firefox দ্বারা Element , DocumentFragment এবং Document ইন্টারফেসে সমর্থিত। এটি আপনাকে অবজেক্টের একটি তাৎক্ষণিক চাইল্ড এলিমেন্টকে তার অন্য একটি চাইল্ড এলিমেন্টের আগে স্থানান্তর করতে দেয়, উভয় এলিমেন্টই তাদের অবস্থা ধরে রাখে।

moveBefore() ব্যবহার করে DOM মিউটেশনের সময় Preserve state সম্পর্কে আরও জানুন।

:target-before এবং :target-after ছদ্ম-ক্লাস

Chrome 142 এমন সিউডো-ক্লাস যোগ করে যা একই স্ক্রোল মার্কার গ্রুপের মধ্যে সক্রিয় মার্কার (matching :target-current ) এর আগে বা পরে থাকা স্ক্রোল মার্কারগুলির সাথে মেলে, যা ফ্ল্যাট ট্রি অর্ডার দ্বারা নির্ধারিত হয়:

  • :target-before : গ্রুপের মধ্যে ফ্ল্যাট ট্রি অর্ডারে সক্রিয় মার্কারের পূর্বে থাকা সমস্ত স্ক্রোল মার্কারগুলির সাথে মিল করে।
  • :target-after : গ্রুপের মধ্যে ফ্ল্যাট ট্রি অর্ডারে সক্রিয় মার্কার অনুসরণকারী সমস্ত স্ক্রোল মার্কারগুলির সাথে মিল করে।

Browser Support

  • ক্রোম: ১৩৫।
  • প্রান্ত: ১৩৫।
  • ফায়ারফক্স: সমর্থিত নয়।
  • সাফারি: সমর্থিত নয়।

Source

স্টাইল কন্টেইনার কোয়েরির জন্য রেঞ্জ সিনট্যাক্স এবং if()

ক্রোম ১৪২ রেঞ্জ সিনট্যাক্সের জন্য সমর্থন যোগ করে CSS স্টাইল কোয়েরি এবং if() ফাংশনকে উন্নত করে।

এটি স্টাইল কোয়েরিগুলিকে সঠিক মান মিলের বাইরেও প্রসারিত করে (উদাহরণস্বরূপ, style(--theme: dark) )। ডেভেলপাররা কাস্টম বৈশিষ্ট্য, আক্ষরিক মান (উদাহরণস্বরূপ, 10px বা 25%) এবং attr() এবং env() মতো প্রতিস্থাপন ফাংশন থেকে মান তুলনা করতে তুলনামূলক অপারেটর (যেমন > এবং < ) ব্যবহার করতে পারেন। একটি বৈধ তুলনার জন্য, উভয় পক্ষকে একই ডেটা টাইপে সমাধান করতে হবে। এটি নিম্নলিখিত সংখ্যাসূচক প্রকারের মধ্যে সীমাবদ্ধ: <length> , <number> , <percentage> , <angle> , <time> , <frequency> , এবং <resolution> .

ইন্টারেস্ট ইনভোকার ( interestfor অ্যাট্রিবিউট)

Chrome 142 <button> এবং <a> উপাদানগুলিতে একটি interestfor বৈশিষ্ট্য যোগ করে। এই বৈশিষ্ট্যটি উপাদানটিতে "আগ্রহ" আচরণ যোগ করে। যখন একজন ব্যবহারকারী উপাদানটিতে আগ্রহ দেখায় , তখন লক্ষ্য উপাদানটিতে ক্রিয়াগুলি ট্রিগার করা হয়, উদাহরণস্বরূপ, একটি পপওভার দেখানো।

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

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

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

Firefox 145-এ ToggleEvent ইন্টারফেসের source প্রোপার্টি এবং Atomics.waitAsync() স্ট্যাটিক মেথড অন্তর্ভুক্ত রয়েছে।

Chrome 145-এ CSS অ্যাঙ্করড ফলব্যাক কন্টেইনার কোয়েরি অন্তর্ভুক্ত রয়েছে। এটি @container anchored(fallback) অ্যাঙ্কর-পজিশনড এলিমেন্টের স্টাইল ডিসেন্ডেন্টের সাথে পরিচয় করিয়ে দেয় যার উপর ভিত্তি করে position-try-fallbacks মান প্রয়োগ করা হয়।