ইন্টারপ 2023: ডেভেলপারদের জন্য ওয়েবের উন্নতি অব্যাহত রাখা

আবার 2023 সালে, সমস্ত প্রধান ব্রাউজার বিক্রেতা এবং অন্যান্য স্টেকহোল্ডাররা, শীর্ষস্থানীয় ব্রাউজারগুলির সামঞ্জস্যের সমস্যাগুলি সমাধান করতে একসাথে কাজ করে৷

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

ইন্টারপ 2023 ফোকাস এলাকা

এই সময়ে, আমাদের কাছে 26টির কম ফোকাস এলাকা নেই, যা আমাদের প্রকল্প নথিতে বিস্তারিতভাবে বর্ণিত হয়েছে। তারা, বর্ণানুক্রমিকভাবে:

আপনি MDN ওয়েব ডক্সের উপর ভিত্তি করে ওয়েব প্ল্যাটফর্ম টেস্টে সমস্ত ফোকাস এলাকার সম্পূর্ণ বিবরণ খুঁজে পেতে পারেন, তবে এখানে কয়েকটি রয়েছে যা আমরা মনে করি আপনি সত্যিই উত্তেজিত হতে পারেন।

ধারক প্রশ্ন

কন্টেইনার কোয়েরি অনেক বছর ধরে ডেভেলপারদের কাছ থেকে একটি শীর্ষ অনুরোধ ছিল এবং 2022 সালে Chrome এবং Safari এটি পাঠিয়েছে। Firefox Firefox 110-এ কন্টেইনার কোয়েরি পাঠানোর আশা করে, এবং এই ফোকাস এলাকার পরীক্ষাগুলি নিশ্চিত করতে সাহায্য করে যে কনটেইনার কোয়েরিগুলি নির্ভরযোগ্যভাবে ক্রস-ব্রাউজারে কাজ করে এবং বিশেষত্ব অনুযায়ী।

: আছে(…)

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

কাস্টম বৈশিষ্ট্য

CSS কাস্টম বৈশিষ্ট্য, যা CSS ভেরিয়েবল নামেও পরিচিত, স্টাইলশীটে একবার একটি মান সংজ্ঞায়িত করা এবং এটিকে অনেক জায়গায় পুনরায় ব্যবহার করা সম্ভব করে, পুনরাবৃত্তি হ্রাস করে। উদাহরণস্বরূপ, আপনি একটি স্টাইলশীটে একবার একটি সাধারণ রঙ বা ফন্টের আকার নির্ধারণ করতে পারেন এবং এটি সমস্ত উপাদান জুড়ে ব্যবহার করতে পারেন। কাস্টম বৈশিষ্ট্যগুলির জন্য মৌলিক সমর্থন দীর্ঘদিন ধরে ব্রাউজারগুলিতে রয়েছে। ইন্টারপ 2023 @property at-rule এর উপর ফোকাস করে। @property একটি স্টাইলশীটে একটি কাস্টম প্রপার্টি রেজিস্ট্রেশন উপস্থাপন করে, যা প্রপার্টির প্রকার চেক করার অনুমতি দেয়, ডিফল্ট মান সেট করে এবং প্রপার্টিটি মানের উত্তরাধিকারী হয় কিনা। @property-এ আরও জানুন: CSS ভেরিয়েবলকে সুপার পাওয়ার দেওয়া

CSS মাস্কিং

CSS মাস্কিং ইমেজ ইফেক্ট প্রয়োগ করার পদ্ধতি প্রদান করে, যেমন আপনি CSS ব্যবহার করে গ্রাফিক্স অ্যাপ্লিকেশনে দেখতে পারেন। বিভিন্ন মাস্কিং বৈশিষ্ট্যের জন্য সমর্থন প্যাচী, মাস্কিং ব্যবহার করা উচিত তার চেয়ে কঠিন করে তোলে। এই ফোকাস ক্ষেত্রটি বিকাশকারীদের আত্মবিশ্বাসের সাথে ক্রস-ব্রাউজার সৃজনশীল প্রভাব ব্যবহার করতে সহায়তা করবে। ইমেজ মাস্কিং সম্পর্কে এই নিবন্ধে ইমেজে প্রভাব প্রয়োগ সম্পর্কে আরও জানুন।

অফস্ক্রিন ক্যানভাস

<canvas> উপাদান এবং Canvas API স্ক্রিনে গ্রাফিক্স আঁকার জন্য একটি স্ক্রিপ্টযোগ্য উপায় প্রদান করে। যাইহোক, এটি কর্মক্ষমতা সমস্যা সৃষ্টি করতে পারে কারণ কাজটি ব্যবহারকারীর ইন্টারঅ্যাকশনের মতো একই থ্রেডে সম্পন্ন হয়। অফস্ক্রিন ক্যানভাস ডেভেলপারদের একটি ক্যানভাস অফার করে যা DOM এবং Canvas API থেকে আলাদা করা হয়। বিকাশকারীরা মূল থ্রেড থেকে পৃথক ওয়েব ওয়ার্কারে রেন্ডারিং কাজগুলিও চালাতে পারে। অফস্ক্রিন ক্যানভাসের পারফরম্যান্স সুবিধা সম্পর্কে আরও জানুন।

পয়েন্টার এবং মাউস ইভেন্ট

মাউস, কলম, স্টাইলাস বা টাচ স্ক্রিন ব্যবহার করে একটি পৃষ্ঠার সাথে ইন্টারঅ্যাক্ট করার সময় পয়েন্টার ইভেন্টগুলি গুলি করা হয়। মাউস ইভেন্টগুলি একটি মাউস ব্যবহার করার সময় গুলি করা হয়, তবে ঐতিহাসিক কারণে স্পর্শের জন্যও। এই ফোকাস এলাকাটি পৃষ্ঠাগুলির সাথে পয়েন্টার এবং মাউসের ইন্টারঅ্যাকশনের আচরণকে কভার করে, সহ তারা কীভাবে হিট টেস্টিং এবং স্ক্রলিং এলাকার সাথে ইন্টারঅ্যাক্ট করে। এই এলাকায় ওয়েব প্ল্যাটফর্ম টেস্টের অভাবের কারণে 2023-এর ফোকাস এলাকা স্পর্শ এবং লেখনী বাদ দেয়।

ওয়েবকোডেক্স

WebCodecs API ডেভেলপারদের ভিডিওর পৃথক ফ্রেম এবং অডিওর অংশগুলি অ্যাক্সেস করার পদ্ধতি প্রদান করে। এটি ইতিমধ্যেই ব্রাউজারে উপলব্ধ কোডেকগুলিতে অ্যাক্সেস অফার করে এবং তাদের সাথে যোগাযোগ করার জন্য বিভিন্ন ইন্টারফেস দেয়৷ ওয়েবকোডেক্সের সাথে ভিডিও প্রসেসিং নিবন্ধটি দেখায় যে কীভাবে এপিআই ব্যবহার করতে হয় ডিকোড করতে এবং একটি ক্যানভাসে পৃথক ফ্রেম রেন্ডার করতে হয়।

ওয়েব উপাদান

ওয়েব কম্পোনেন্টস হল কাস্টম এলিমেন্টস এবং শ্যাডো ডম-এর মতো পুনঃব্যবহারযোগ্য উপাদান তৈরি করতে ব্যবহৃত বেশ কয়েকটি প্রযুক্তির জন্য একটি ছাতা শব্দ। ইন্টারপ 2023 এই মৌলিক প্রযুক্তিগুলির আন্তঃকার্যক্ষমতা উন্নত করার উপর ফোকাস করবে।

ড্যাশবোর্ড

ইন্টারপ 2023 ড্যাশবোর্ডে সারা বছর ধরে অগ্রগতি অনুসরণ করুন, যেখানে আপনি বর্তমান স্কোর এবং সমস্ত প্রধান ব্রাউজার ইঞ্জিন জুড়ে এই ফোকাস এলাকাগুলিকে সম্বোধন করার স্থিতি দেখতে পাবেন।

সামগ্রিকভাবে ইন্টারপের জন্য স্কোর: 62, তদন্ত: 0, এবং ব্রাউজার প্রতি স্কোর - ক্রোম এবং এজের জন্য 86, ফায়ারফক্সের জন্য 74, সাফারি প্রযুক্তি পূর্বরূপের জন্য 86।
ইন্টারপ 2023 ড্যাশবোর্ড (31শে জানুয়ারি, 2023 সালের স্ক্রিনশট নেওয়া হয়েছে)।

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

ব্রাউজার স্কোর এবং সামগ্রিক ইন্টারপ স্কোর সহ সমস্ত সক্রিয় ফোকাস এলাকার একটি তালিকা
সমস্ত সক্রিয় ফোকাস এলাকা এবং তাদের সামগ্রিক ইন্টারপ স্কোর।

ইন্টারপ 2023 সম্পর্কে আরও