DevTools (Chrome 151)-এ নতুন কী আছে

Matthias Rohmer

প্রকাশিত: ২৮ জুলাই, ২০২৬

ক্রোম ১৫১ সংস্করণে এআই অ্যাসিস্ট্যান্সের এজেন্ট ওয়াকথ্রু-এর জন্য আরও উইজেট, স্টাইলস ট্যাবে সিএসএস স্পেসিফিসিটির বিশদ বিশ্লেষণ, ::interest-button সিউডো-এলিমেন্টের জন্য সমর্থন এবং ডেভটুলস এমসিপি সার্ভারে বড় ধরনের আপডেট আনা হয়েছে।

এজেন্টদের জন্য ডেভটুলস

v1.6.0 পর্যন্ত সাম্প্রতিক রিলিজগুলোতে, Antigravity, Claude, Codex-এর মতো কোডিং এজেন্টদের জন্য Chrome DevTools তার ডিবাগিং ক্ষমতা উল্লেখযোগ্যভাবে প্রসারিত করেছে।

v1.4.0 থেকে v1.6.0 পর্যন্ত সংস্করণগুলিতে অন্তর্ভুক্ত আপডেটগুলি হলো:

• উন্নত মেমরি ডিবাগিং: নতুন get_heapsnapshot_duplicate_strings টুলটি জাভাস্ক্রিপ্ট হিপে অপ্রয়োজনীয় স্ট্রিং অ্যালোকেশনের কারণে সৃষ্ট মেমরি অপচয় শনাক্ত করে। get_heapsnapshot_details মোট অবজেক্ট সংখ্যা ও মেমরি সাইজের সমষ্টি, ফিল্টারযোগ্য হিপ স্ন্যাপশটের সমষ্টি, GC রুট রিটেইনিং পাথ রিটার্ন করে এবং বিভিন্ন স্ন্যাপশটের মধ্যে মেমরি ডিফারেন্সিং সক্ষম করে।
• GCF ফরম্যাট এনকোডিং ( experimentalGcfFormat ): সহায়ক ক্লায়েন্টদের জন্য ব্যান্ডউইথ এবং পার্সিং দক্ষতা অপ্টিমাইজ করতে GCF-এনকোডেড টুল রেসপন্সের সাপোর্ট যোগ করা হয়েছে।
• একযোগে একাধিক এজেন্টের পেজ রাউটিং এবং বিচ্ছিন্ন কনটেক্সট: --experimentalPageIdRouting সুস্পষ্ট pageId রাউটিং ব্যবহার করে সমান্তরাল সাবএজেন্টদেরকে বিভিন্ন ব্রাউজার ট্যাবে একযোগে কাজ করতে সক্ষম করে। --isolated mode এবং isolatedContext প্যারামিটারগুলো প্রতি সেশনের জন্য অস্থায়ী ক্রোম প্রোফাইল এবং স্টোরেজ তৈরি করে।

আরও জানতে ও কাজ শুরু করতে, গিটহাবে থাকা ‘DevTools for agents’ রিপোজিটরিটি দেখুন।

এআই সহায়তা

ছবি/স্ক্রিনকাস্ট: এআই সহায়তা প্যানেলটিতে নতুন নেটওয়ার্ক ট্র্যাক ইনলাইন উইজেট এবং জিএফএম টেবিল সাপোর্টসহ ইন্টারেক্টিভ ওয়াকথ্রু দেখানো হচ্ছে।

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

এছাড়াও, রেসপন্স মেসেজগুলো এখন ফরম্যাট করা সারণিবদ্ধ ডেটা সারাংশের জন্য গিটহাব ফ্লেভার্ড মার্কডাউন (GFM) টেবিল রেন্ডার করা সম্পূর্ণরূপে সমর্থন করে।

CSS স্পেসিফিসিটি বিশ্লেষণ এবং ::interest-button সমর্থন

এলিমেন্টস প্যানেলটি আধুনিক ওয়েব প্ল্যাটফর্ম এপিআই-এর জন্য আরও গভীর সিএসএস পরিদর্শন এবং তৈরির টুল নিয়ে আসে:

• CSS স্পেসিফিসিটির বিশদ বিশ্লেষণ: এখন স্টাইলস ট্যাবে সিলেক্টরের নামগুলোর উপর মাউস রাখলে একটি বিশদ টুলটিপ দেখা যাবে, যা ব্যাখ্যা করবে কীভাবে প্রতিটি ক্লাস, আইডি, এলিমেন্ট বা সিউডো-ক্লাস (a, b, c) স্পেসিফিসিটি গণনায় অবদান রাখে। এটি একটি কমিউনিটি কন্ট্রিবিউশন, @hjanuschka- কে ধন্যবাদ!
• ::interest-button সিউডো-এলিমেন্ট: DevTools এখন নতুন ::interest-button CSS সিউডো-এলিমেন্টটিকে (যা HTML interesttarget স্পেসিফিকেশনের একটি অংশ) এলিমেন্টস ট্রি আউটলাইন এবং স্টাইলস ট্যাবে সম্পূর্ণরূপে পার্স করে ও উপস্থাপন করে।
• এইচটিএমএল রিলেশন অ্যাট্রিবিউটের জন্য অ্যাসিঙ্ক্রোনাস টার্গেট লিঙ্কিং: popovertarget , interesttarget , এবং commandfor মতো এইচটিএমএল অ্যাট্রিবিউটগুলো এখন অ্যাসিঙ্ক্রোনাসভাবে তাদের টার্গেট ডোম নোডগুলোকে ফেচ করে এবং ইনলাইনে দৃশ্যত লিঙ্ক করে।
• বৃহৎ স্টাইলশীটের জন্য লেজি রেন্ডারিং: এখন কোনো এলিমেন্টে ২০০টির বেশি CSS প্রপার্টি থাকলে স্টাইলস ট্যাবটি লেজি প্রপার্টি ডেকোরেশন ব্যবহার করে, যা রেন্ডার ব্লক টাইম কয়েক সেকেন্ড থেকে কমিয়ে মিলিসেকেন্ডে নিয়ে আসে।

ক্রোমিয়াম সমস্যা: 353436867 , 453705247 , 524406293 , 457696384 , 524131115

মেমরি ডিবাগিং: নেটিভ কনটেক্সট অ্যাট্রিবিউশন এবং ক্লোজার রিটেনশন

মেমরি প্যানেলে এখন মাল্টি-ফ্রেম বা মাল্টি-কন্টেক্সট ওয়েব অ্যাপ্লিকেশনগুলিতে জটিল জাভাস্ক্রিপ্ট মেমরি লিক নির্ণয় করা অনেক বেশি সহজ হয়ে গেছে:

• নেটিভ V8 কনটেক্সট অ্যাট্রিবিউশন: হিপ স্ন্যাপশটগুলো এখন একটি দ্বি-পর্যায়ের অ্যাট্রিবিউশন অ্যালগরিদম কার্যকর করে। স্ট্যাটিক পয়েন্টার ইনফারেন্স native_context ম্যাপগুলো সমাধান করে, এবং গ্রাফ রিচেবিলিটি অবশিষ্ট অবজেক্টগুলোকে ট্রেস করে। একটিমাত্র নেটিভ কনটেক্সট থেকে পৌঁছানো যায় এমন অবজেক্টগুলোকে সরাসরি সেই কনটেক্সটে অ্যাট্রিবিউট করা হয়, অন্যদিকে একাধিক কনটেক্সট থেকে পৌঁছানো যায় এমন অবজেক্টগুলোকে একটি শেয়ার্ড কনটেক্সট বাকেটে শ্রেণীবদ্ধ করা হয়।
• "Retained by Context" ফিল্টার: হিপ স্ন্যাপশট পার্সপেক্টিভের একটি নতুন UI ফিল্টার, যা আপনাকে শুধুমাত্র জাভাস্ক্রিপ্ট ক্লোজার কনটেক্সট অবজেক্টের মাধ্যমে রিটেইন করা অবজেক্টগুলোকে আলাদা করতে দেয়।
• কনফিগারযোগ্য প্রপার্টি প্রদর্শনের ক্রম: একটি নতুন কনটেক্সট মেনু টগল, ‘প্রপার্টিগুলোকে বর্ণানুক্রমিকভাবে সাজান ’ (যা ডিফল্টরূপে সক্রিয় থাকে), আপনাকে হিপ অবজেক্ট প্রপার্টিগুলো পরিদর্শন করার সময় বর্ণানুক্রমিক সাজানো এবং মূল JS প্রপার্টি সন্নিবেশ ক্রমের মধ্যে টগল করার সুযোগ দেয়।

ক্রোমিয়াম সমস্যা: 497855658 , 423838364 , 40833016

প্রতিশ্রুতিযুক্ত এক্সটেনশন এপিআই এবং নিরাপত্তা জোরদারকরণ

DevTools এক্সটেনশন API-গুলো আধুনিক অ্যাসিঙ্ক্রোনাস প্যাটার্ন এবং আরও কঠোর নিরাপত্তা নিয়ন্ত্রণ দ্বারা আপডেট করা হয়েছে:

• নেটিভ প্রমিজ সাপোর্ট: chrome.devtools.network ( getHAR() , Request.getContent() ), chrome.devtools.panels , এবং chrome.devtools.inspectedWindow ( eval() , getResources() () , Resource.getContent() , Resource.setContent() )-এর অ্যাসিঙ্ক মেথডগুলো এখন কোনো কলব্যাক প্যারামিটার ছাড়া কল করা হলে স্ট্যান্ডার্ড জাভাস্ক্রিপ্ট Promise অবজেক্ট রিটার্ন করে।
• এক্সটেনশনের নিরাপত্তা সীমা: DevTools এক্সটেনশনগুলো এখন ব্লক করা টার্গেট URL-এর HAR রিসোর্স ফেচ করতে পারবে না, inspectedWindow.eval এ ক্রস-এক্সটেনশন মূল্যায়নের জন্য অবশ্যই extensionsOnChromeUrls পারমিশন পূরণ করতে হবে এবং file:// রিসোর্সের উপর allowFileAccess চেক প্রয়োগ করতে হবে।

অন্যান্য হাইলাইট এবং সংশোধন

এই রিলিজে কিছু ছোটখাটো উন্নতি এবং বাগ ফিক্স করা হয়েছে:

• পারফরম্যান্স : সফট এলসিপি এবং সফট নেভিগেশন মার্কারের পাশাপাশি সফট এফসিপি (ফার্স্ট কন্টেন্টফুল পেইন্ট) টাইমলাইন মার্কার যোগ করা হয়েছে এবং ডিটেইলস ড্রয়ার হেডারগুলো আপডেট করা হয়েছে।
• পারফরম্যান্স : PressureObserver সাপোর্টবিহীন অ্যান্ড্রয়েড ডিভাইসগুলিতে সিপিইউ থ্রটলিং ক্যালিব্রেশনের সময় কম্পিউট প্রেসার চেক এড়িয়ে যাওয়ার জন্য সুরক্ষা ব্যবস্থা যুক্ত করা হয়েছে।
• নেটওয়ার্ক : ড্যাশ-প্রিফিক্সযুক্ত ইউআরএল-এর ক্ষেত্রে কমান্ড-লাইন ফ্ল্যাগের ভুল ব্যাখ্যা এড়ানোর জন্য, টার্গেট ইউআরএল-এর শুরুতে --url যুক্ত করতে cURL হিসেবে কপি আপডেট করা হয়েছে।
• উৎস : ডিফল্টরূপে সোর্স ম্যাপ স্কোপ রেজোলিউশন সক্রিয় করা হয়েছে, যা ডিবাগিংয়ের সময় ভেরিয়েবল স্কোপ রেজোলিউশন এবং সিম্বল আন-মিনিফিকেশন উন্নত করে।
• সেটিংস : নতুন আইফোন এবং পিক্সেল মডেলের জন্য যাচাইকৃত সেফ-এরিয়া ইনসেট সহ এমুলেটেড ডিভাইস প্রিসেট আপডেট করা হয়েছে, এবং কাস্টম ডিভাইস ইউজার-এজেন্ট ফিল্ডগুলো navigator.userAgent দিয়ে আগে থেকেই পূরণ করা হয়। (ক্রোমিয়াম সমস্যা: 40718410 , 518215252 )
• সেটিংস : লিঙ্ক হ্যান্ডলিং সেটিং ড্রপ-ডাউনটি আপডেট করা হয়েছে, যাতে এটি এক্সটেনশনের সরাসরি অরিজিন ইউআরএল-এর পরিবর্তে ব্যবহারকারী-বান্ধব এক্সটেনশন শিরোনাম প্রদর্শন করে।
• লাইটহাউস : বান্ডেল করা লাইটহাউস মডিউলটি সংস্করণ 13.4.0 -এ আপডেট করা হয়েছে। (ক্রোমিয়াম ইস্যু: 40543651 )

প্রবেশগম্যতা উন্নয়ন

ক্রোম ১৫১-এ নিম্নলিখিত অ্যাক্সেসিবিলিটি উন্নতিগুলো আনা হয়েছে:

• এলিমেন্টস : সাংঘর্ষিক ব্যাকগ্রাউন্ড-কালার ওভাররাইডগুলো অপসারণ করার মাধ্যমে উইন্ডোজ হাই কনট্রাস্ট / @media (forced-colors: active) মোডের অধীনে টগল করা টুলবার আইকনগুলোর (যেমন স্ক্রিপ্ট এক্সিকিউশন রিজুম বাটন) দৃশ্যমানতা পুনরুদ্ধার করা হয়েছে। (ক্রোমিয়াম ইস্যু: 519762185 )
• কনসোল : কনসোল পিনগুলিতে সংক্ষিপ্ত লাইভ এক্সপ্রেশন স্ট্রিং মানগুলির জন্য অ্যাক্সেসযোগ্য পূর্ণ-পাঠ্য title টুলটিপ যুক্ত করা হয়েছে।