Chrome 122-এ নতুন

আদ্রিয়ানা জারা

আপনার যা জানা দরকার তা এখানে:

আমি আদ্রিয়ানা জারা। চলুন ডুব দিয়ে দেখি Chrome 122-এ ডেভেলপারদের জন্য নতুন কী আছে।

স্টোরেজ বাকেট API।

স্থায়ী সঞ্চয়স্থানকে আরও ভালভাবে পরিচালনা করতে স্টোরেজ বাকেট API আরও গ্রানুলারিটি প্রদান করে।

ঐতিহ্যগতভাবে, ব্যবহারকারীর ডিভাইসে স্টোরেজ স্পেস ফুরিয়ে গেলে, IndexedDB বা localStorage মতো API-এর সাথে সংরক্ষিত ডেটা ব্যবহারকারীর হস্তক্ষেপ না করেই হারিয়ে যায়। স্টোরেজকে স্থায়ী করার একটি উপায় হল StorageManager ইন্টারফেসের persist() পদ্ধতি ব্যবহার করা। যাইহোক, সঞ্চয়স্থানের জন্য অনুরোধ করার এই পদ্ধতিটি স্থির থাকে বা কিছুই নয়

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

সমস্ত সঞ্চয়স্থান সমান তৈরি করা হয় না দেখুন: স্টোরেজ বালতি ব্যবহার শুরু করার জন্য আরও বিশদ বিবরণ এবং কোড নমুনার জন্য স্টোরেজ বাকেট প্রবর্তন করা হচ্ছে ।

পারফরম্যান্স প্যানেলে DevTools উন্নতি

Chrome 122 DevTools-এ পারফরম্যান্স প্যানেলে নিম্নলিখিত উন্নতিগুলি অন্তর্ভুক্ত রয়েছে৷

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

এছাড়াও, এখন প্রধান ট্র্যাকে ইভেন্ট ইনিশিয়েটর রয়েছে৷ পারফরম্যান্স > প্রধান ট্র্যাক ডিফল্টভাবে তীরগুলিকে সংযোগকারী সূচনাকারীদের এবং তাদের দ্বারা সৃষ্ট নিম্নলিখিত ইভেন্টগুলি দেখায়।

  • শৈলী বা বিন্যাস অবৈধকরণ -> শৈলী বা বিন্যাস পুনরায় গণনা করুন
  • অ্যানিমেশন ফ্রেম অনুরোধ -> অ্যানিমেশন ফ্রেম ফায়ার করা হয়েছে
  • নিষ্ক্রিয় কলব্যাকের অনুরোধ করুন -> ফায়ার আইডল কলব্যাক
  • টাইমার ইনস্টল করুন -> টাইমার ফায়ারড
  • ওয়েবসকেট তৈরি করুন -> পাঠান... এবং ওয়েবসকেট হ্যান্ডশেক গ্রহণ করুন বা ওয়েবসকেট ধ্বংস করুন

তীরগুলি দেখতে, ট্রেসে এমন একটি ইভেন্ট খুঁজুন এবং এটিতে ক্লিক করুন৷

একটি নিষ্ক্রিয় কলব্যাকের অনুরোধ এবং ফায়ারিং থেকে একটি তীর।

Devtools 122-এ নতুন কী আছে তাতে আরও DevTools আপডেট খুঁজুন।

Async ক্লিপবোর্ড API unsanitized বিকল্প

Async ক্লিপবোর্ড API ব্যবহার করে অনুলিপি এবং পেস্ট করার সময় read() পদ্ধতির জন্য unsanitized বিকল্প অ্যাপ এবং ওয়েবসাইটগুলিকে অস্বাস্থ্যকর HTML পেতে দেয়। সাইটগুলি এই সম্পত্তি অন্তর্ভুক্ত না করলে, ক্লিপবোর্ড থেকে HTML পড়া স্যানিটাইজ করা হবে।

ডিফল্টরূপে, async API ব্যবহার করে text/html MIME প্রকারগুলি পড়ার সময়, নিরাপত্তা সংক্রান্ত উদ্বেগের কারণে স্যানিটাইজারকে HTML মার্কআপ থেকে বিষয়বস্তু বাদ দেওয়ার জন্য আহ্বান করা হয় এবং ফলে HTML-এ শৈলীগুলি ইনলাইন করা হয়। এটি একটি বড় এইচটিএমএল পেলোডের দিকে নিয়ে যায় এবং যখন ওয়েব ডেভেলপার বা মোবাইল অ্যাপগুলি পড়ে তখন HTML সামগ্রীর বিশ্বস্ততা হারায়৷

আপনি নিম্নলিখিত উদাহরণে আউটপুট পার্থক্য দেখতে পারেন.

ইনপুট:

<style>p { color: blue; }</style><p>Hello, World!</p>'

স্যানিটাইজড (ডিফল্ট):

<p style='color: blue; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;'>Hello, World!</p>

unsanitized বিকল্প সহ:

<html><head><style>p { color: blue; }</style></head><body><p>Hello, World!</p></body></html>

ক্লিপবোর্ড API-এর মূল বিষয়গুলি শিখতে ক্লিপবোর্ড অ্যাক্সেস আনব্লকিং-এ যান৷

এবং আরো!

অবশ্যই আরো অনেক আছে.

  • CSS-এ, অসমর্থিত বৈশিষ্ট্য সহ কন্টেইনার কোয়েরি কখনও মেলে না। উদাহরণস্বরূপ, অজানা বৈশিষ্ট্যের কারণে নিম্নলিখিত ক্যোয়ারী কখনই মেলে না: 
@container (width > 0px) or (unknown) {}

  • dataTransfer.clearData() ফাইল অবজেক্টকে প্রভাবিত করে না, এটি শুধুমাত্র টেক্সট টাইপ অবজেক্ট মুছে দেয়।

  • WebGL-এর drawingBufferStorage সাহায্যে আপনি রেন্ডারিংকে ডিফল্ট ড্রয়িং বাফার পিক্সেল ফর্ম্যাটে রূপান্তর করার সময় অতিরিক্ত অনুলিপি এড়াতে পারেন এবং 8 বিটের বেশি নির্ভুলতা রয়েছে এমন সামগ্রী আঁকতে পারেন।

আরও পড়া

এটি শুধুমাত্র কিছু মূল হাইলাইট কভার করে। Chrome 122-এ অতিরিক্ত পরিবর্তনের জন্য নিম্নলিখিত লিঙ্কগুলি দেখুন।

সদস্যতা

আপ টু ডেট থাকার জন্য, Chrome Developers YouTube চ্যানেলে সাবস্ক্রাইব করুন , এবং যখনই আমরা একটি নতুন ভিডিও লঞ্চ করব আপনি একটি ইমেল বিজ্ঞপ্তি পাবেন৷

Yo soy Adriana Jara, এবং Chrome 123 রিলিজ হওয়ার সাথে সাথে, Chrome-এ নতুন কী আছে তা জানাতে আমি এখানেই থাকব!