DevTools, Chrome 140-এ নতুন কী আছে৷

সোফিয়া এমেলিয়ানোভা
Sofia Emelianova
GitHub

জেমিনি দিয়ে আরও অন্তর্দৃষ্টি ডিবাগ করুন

পারফরম্যান্স > ইনসাইটস -এ , আপনি এখন AI সহায়তা প্যানেলে জেমিনির সাথে চ্যাট এবং ডিবাগ করতে Debug with AI (পূর্বে Ask AI ) -এ ক্লিক করতে পারেন আরও পারফরম্যান্স ইনসাইট:

  • ছবি সরবরাহ উন্নত করুন
  • লিগ্যাসি জাভাস্ক্রিপ্ট
  • ডুপ্লিকেট জাভাস্ক্রিপ্ট
  • আধুনিক HTTP

আরও কর্মক্ষমতা অন্তর্দৃষ্টির জন্য 'এআই দিয়ে ডিবাগ করুন' বোতামটি যোগ করার আগে এবং পরে।

'নেটওয়ার্ক কন্ডিশন'-এ 'সেভ-ডেটা' হেডারটি অনুকরণ করুন।

নেটওয়ার্ক কন্ডিশন প্যানেলে, আপনি এখন Save-Data রিকোয়েস্ট হেডারের আচরণ অনুকরণ করতে পারেন। এই হেডারটি একটি নেটওয়ার্ক ক্লায়েন্ট ইঙ্গিত যা ক্লায়েন্টের ডেটা ব্যবহারের হ্রাসের পছন্দ নির্দেশ করে। এটি navigator.connection.saveData API এর মাধ্যমেও উপলব্ধ।

'নেটওয়ার্ক কন্ডিশন'-এ 'সেভ-ডেটা' রিকোয়েস্ট হেডার এমুলেশন যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 40668980 ।

CSS প্রপার্টি টুলটিপে বেসলাইন স্ট্যাটাস দেখুন

Elements > Styles তে, যখন আপনি যেকোনো CSS প্রপার্টির উপর কার্সার রাখেন, তখন আপনি এখন প্রপার্টির সংজ্ঞা অনুসারে, তার Baseline স্ট্যাটাস অনুসারে প্রধান ব্রাউজারগুলিতে এর উপলব্ধতা দেখতে পাবেন।

CSS প্রপার্টি টুলটিপসে বেসলাইন স্ট্যাটাস যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 417749762 ।

ব্যবহারকারী এজেন্ট ক্লায়েন্ট ইঙ্গিতগুলিতে ফর্ম ফ্যাক্টরগুলিকে ওভাররাইড করুন

নেটওয়ার্ক শর্ত > ব্যবহারকারী এজেন্ট ক্লায়েন্ট ইঙ্গিত ড্রপ-ডাউনে, এখন আপনার কাছে ফর্ম ফ্যাক্টরগুলিকে ওভাররাইড করার বিকল্প রয়েছে, বিশেষ করে, Sec-CH-UA-Form-Factors অনুরোধ হেডারের মানগুলি।

ব্যবহারকারী এজেন্ট ক্লায়েন্ট ইঙ্গিতগুলিতে ফর্ম ফ্যাক্টর ওভাররাইডের বিকল্পগুলি যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 422218341 ।

বাতিঘর ১২.৮.০

লাইটহাউস প্যানেলটি এখন লাইটহাউস ১২.৮.০ চালিত।

এই সংস্করণে সবচেয়ে উল্লেখযোগ্যভাবে, লাইটহাউস একটি নতুন প্রতিবেদন যোগ করেছে: বিশ্বস্ত প্রকারের সাহায্যে DOM-ভিত্তিক XSS মিটিগেট করুন।

পরিবর্তনগুলির সম্পূর্ণ তালিকাও দেখুন।

DevTools-এ Lighthouse প্যানেল ব্যবহারের মূল বিষয়গুলি জানতে, Lighthouse: ওয়েবসাইটের গতি অপ্টিমাইজ করুন দেখুন।

ক্রোমিয়াম সমস্যা: 40543651 ।

বিবিধ হাইলাইটস

এই রিলিজে অনেক উল্লেখযোগ্য সংশোধন এবং উন্নতির মধ্যে এটি হল:

  • এআই সহায়তা :
    • সেটিংসে সংশ্লিষ্ট AI বৈশিষ্ট্যটি অক্ষম করলে চ্যাট ইতিহাস এখন সাফ হয়ে যাবে।
    • অ্যাক্সেসিবিলিটি : স্ক্রিন রিডাররা এখন প্রসঙ্গ শিরোনাম আগেভাগে ঘোষণা করে, উত্তর স্ট্রিমিং শুরু হলে "উত্তর লোড হচ্ছে" এবং উত্তর সম্পূর্ণ হলে "উত্তর প্রস্তুত"।
  • উপাদান :
    • স্টাইলস ট্যাব এখন sibling-index() , sibling-count() , এবং env() CSS ফাংশন মূল্যায়ন করতে পারে ( crbug.com/417128001 , crbug.com/40196710 )।
    • ::view-transition-group-children pseudo element ( crbug.com/425901164 ) এর জন্য সমর্থন যোগ করা হয়েছে।
    • <summary> উপাদানে ( crbug.com/427172874 ) ইন্টারেক্টিভ কন্টেন্ট সম্পর্কে অ্যাক্সেসিবিলিটি সমস্যাগুলির জন্য সমর্থন যোগ করা হয়েছে।
    • কম্পিউটেড ট্যাব থেকে, আপনি এখন Styles ( crbug.com/41486012 ) এর লংহ্যান্ড প্রোপার্টিগুলিতে নেভিগেট করতে পারবেন।
    • সহজীকরণ, রঙ সম্পাদক: আপনি এখন কীবোর্ড ব্যবহার করে অ্যানিমেশন ট্রানজিশন এবং রঙের নমুনার জন্য বেজিয়ার নমুনাগুলির সাথে ইন্টারঅ্যাক্ট করতে পারেন ( crbug.com/401213421 )।
  • নেটওয়ার্ক : HAR ফাইল ইম্পোর্টে এখন অনুরোধ এবং প্রতিক্রিয়া কুকিজও অন্তর্ভুক্ত রয়েছে ( crbug.com/432995868 )।
  • ডিভাইস মোড : অ্যাপল ডিভাইসের জন্য ব্যবহারকারী এজেন্টগুলিকে সর্বশেষ Safari 18.5 এ আপডেট করা হয়েছে।

প্রিভিউ চ্যানেলগুলি ডাউনলোড করুন

আপনার ডিফল্ট ডেভেলপমেন্ট ব্রাউজার হিসেবে Chrome Canary , Dev , অথবা Beta ব্যবহার করার কথা বিবেচনা করুন। এই প্রিভিউ চ্যানেলগুলি আপনাকে সর্বশেষ DevTools বৈশিষ্ট্যগুলিতে অ্যাক্সেস দেয়, আপনাকে অত্যাধুনিক ওয়েব প্ল্যাটফর্ম API পরীক্ষা করতে দেয় এবং আপনার ব্যবহারকারীদের আগে আপনার সাইটে সমস্যাগুলি খুঁজে পেতে সহায়তা করে!

Chrome DevTools টিমের সাথে যোগাযোগ করুন

DevTools সম্পর্কিত নতুন বৈশিষ্ট্য, আপডেট বা অন্য কিছু নিয়ে আলোচনা করতে নিম্নলিখিত বিকল্পগুলি ব্যবহার করুন।

DevTools-এ নতুন কী আছে

DevTools সিরিজে নতুন কী কী বিষয় অন্তর্ভুক্ত করা হয়েছে তার একটি তালিকা।