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

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

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

এই সংস্করণটি পারফরম্যান্স প্যানেলে বেশ কিছু উন্নতি এনেছে।

'নেটওয়ার্ক নির্ভরতা ট্রি' অন্তর্দৃষ্টিতে পূর্ব-সংযুক্ত উৎপত্তি

পারফরম্যান্স > ইনসাইটস > নেটওয়ার্ক ডিপেন্ডেন্সি ট্রি ইনসাইট এখন আপনাকে ব্যবহৃত বা অব্যবহৃত প্রি-কানেক্টেড অরিজিন এবং প্রি-কানেক্টেড প্রার্থীদের একটি তালিকা দেখায়, যদি থাকে।

প্রি-কানেক্ট ইঙ্গিতগুলি আপনার সাইটকে গুরুত্বপূর্ণ তৃতীয় পক্ষের উৎসের সাথে প্রাথমিক সংযোগ স্থাপন করতে এবং পৃষ্ঠা লোডের গতি উন্নত করতে দেয়।

'নেটওয়ার্ক নির্ভরতা ট্রি' অন্তর্দৃষ্টিতে প্রাক-সংযুক্ত উৎপত্তি এবং প্রার্থীদের যোগ করার আগে এবং পরে।

আরও তথ্যের জন্য, প্রয়োজনীয় উৎসের সাথে প্রি-কানেক্ট দেখুন।

'ডকুমেন্ট রিকোয়েস্ট ল্যাটেন্সি' ইনসাইট-এ সার্ভারের প্রতিক্রিয়া এবং পুনঃনির্দেশের সময়

পারফরম্যান্স > ইনসাইটস > ডকুমেন্ট রিকোয়েস্ট ল্যাটেন্সি ইনসাইট এখন আপনাকে সার্ভার রেসপন্স টাইম এবং যদি থাকে, তাহলে রিডাইরেক্টের সংখ্যা এবং রিডাইরেক্টেশনের সময় দেখাবে।

'ডকুমেন্ট রিকোয়েস্ট ল্যাটেন্সি' অন্তর্দৃষ্টিতে পুনঃনির্দেশ এবং সার্ভার প্রতিক্রিয়া সময় যোগ করার আগে এবং পরে।

নেটওয়ার্ক অনুরোধের সারাংশে পুনঃনির্দেশনা

পারফরম্যান্স প্যানেল এখন নেটওয়ার্ক অনুরোধের সারাংশ এবং তাদের টুলটিপগুলিতে পুনঃনির্দেশ URL গুলি দেখায়।

নেটওয়ার্ক অনুরোধের সারাংশ এবং টুলটিপগুলিতে পুনঃনির্দেশ URL যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 402353313

পারফর্ম্যান্স ট্রেসে কম শব্দ

পারফরম্যান্স প্যানেল এখন v8 জাভাস্ক্রিপ্ট ইঞ্জিনের compile ক্যাটাগরি থেকে ইভেন্টগুলি দেখাবে না। পূর্বে, এই ইভেন্টগুলি প্রচুর অপ্রয়োজনীয় ওভারহেড এবং শব্দের কারণ হত, বিশেষ করে compile code ইভেন্ট।

পারফরম্যান্স ট্রেস থেকে 'কম্পাইল কোড' ইভেন্টগুলি সরানোর আগে এবং পরে।

যদি আপনি লক্ষ্য করেন যে আপনার জন্য গুরুত্বপূর্ণ কিছু ইভেন্ট এখন অনুপস্থিত, তাহলে crbug.com/414330508 এই ইমেলে আপনার মতামত জানাতে দ্বিধা করবেন না।

'জাভাস্ক্রিপ্ট নমুনা অক্ষম করুন' বন্ধ করা হয়েছে

Performace > Captures সেটিংসে জাভাস্ক্রিপ্ট নমুনা নিষ্ক্রিয় করার বিকল্পটি বিরল উপযোগিতা এবং কম ব্যবহারের কারণে অবচিত এবং সরানো হয়েছে।

'ক্যাপচার সেটিংস' থেকে 'জাভাস্ক্রিপ্ট নমুনা নিষ্ক্রিয় করুন' বিকল্পটি সরানোর আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 414734883

সেন্সরে ভূ-অবস্থান নির্ভুলতা পরামিতি

সেন্সর প্যানেল এখন আপনাকে জিওলোকেশন ইমুলেশনে নির্ভুলতা নির্ধারণ করতে দেয়। এইভাবে, আপনি বিভিন্ন স্তরের জিপিএস নির্ভুলতার পরিচালনা পরীক্ষা করতে পারেন।

সেন্সর প্যানেলে জিওলোকেশন ইমুলেশনে 'নির্ভুলতা' প্যারামিটার যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 40074843

এলিমেন্ট প্যানেলের উন্নতি

এই সংস্করণটি এলিমেন্টস প্যানেলে বেশ কিছু উন্নতি এনেছে।

জটিল CSS মানগুলি সহজে ডিবাগ করুন

জটিল CSS মানগুলি ডিবাগ করতে সাহায্য করার জন্য, Elements > Styles ট্যাবটি এখন আপনাকে hover-এর একটি টুলটিপে দেখাবে:

  • CSS ভেরিয়েবলের সম্পূর্ণ সংজ্ঞা শৃঙ্খল, যাতে আপনাকে একাধিক লিঙ্কে ক্লিক করতে না হয়।
  • জটিল CSS গণনার ধাপে ধাপে মূল্যায়ন, যাতে আপনি আরও দক্ষতার সাথে বাগ সনাক্ত করতে পারেন এবং একটি মান কীভাবে গণনা করা হয় সে সম্পর্কে আরও গভীর ধারণা অর্জন করতে পারেন।

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

সংজ্ঞা শৃঙ্খল এবং প্রসারণযোগ্য জটিল গণনা সহ একটি টুলটিপ যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 396080529

এলিমেন্টস > স্টাইলে @function সাপোর্ট

Chrome-এ @function সাপোর্টের প্রস্তুতি হিসেবে, Elements > Styles ট্যাব এখন আপনার কাস্টম ফাংশনের নামগুলিকে একটি ডেডিকেটেড বিভাগে তাদের সংজ্ঞার সাথে লিঙ্ক করে।

আপনার কাস্টম ফাংশনের নামটি সংশ্লিষ্ট বিভাগের সাথে লিঙ্ক করার আগে এবং পরে।

নেটওয়ার্ক প্যানেলের উন্নতি

এই সংস্করণটি নেটওয়ার্ক প্যানেলে বেশ কিছু উন্নতি এনেছে।

has-request-header ফিল্টার

নেটওয়ার্ক প্যানেল এখন has-request-header ফিল্টার সমর্থন করে যা আপনাকে একটি নির্দিষ্ট অনুরোধ শিরোনামের নাম দিয়ে ফিল্টার করতে দেয়।

নেটওয়ার্ক প্যানেলে 'has-request-header' ফিল্টার যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 397481040

বিচ্ছিন্ন ওয়েব অ্যাপে সরাসরি সকেট

নেটওয়ার্ক প্যানেলে, আপনি এখন TCPSocket, UDPSocket (বাউন্ড মোডে), UDPSocket (কানেক্টেড মোডে) এর মাধ্যমে আইসোলেটেড ওয়েব অ্যাপস (IWAs) এর ট্র্যাফিক পর্যবেক্ষণ করতে পারবেন।

এটি করার জন্য, টেবিলে নিয়মিত অনুরোধের পাশে একটি directscoket সংযোগ নির্বাচন করুন এবং বার্তা ট্যাবে একটি বার্তা নির্বাচন করুন।

নেটওয়ার্ক প্যানেলে IWA-তে ডাইরেক্ট সকেটের সমর্থন যোগ করার আগে এবং পরে।

আইসোলেটেড ওয়েব অ্যাপস (IWAs) ওয়েব অ্যাপ্লিকেশনের জন্য একটি উচ্চ-বিশ্বাসযোগ্য নিরাপত্তা মডেল প্রদান করে। আরও তথ্যের জন্য, "আইসোলেটেড ওয়েব অ্যাপস দিয়ে শুরু করা" দেখুন এবং ডাইরেক্ট সকেটস API প্রয়োগকারী ডেমো অ্যাপটি দেখুন।

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

এই রিলিজে কিছু উল্লেখযোগ্য সংশোধন এবং উন্নতি রয়েছে:

  • অ্যাপ্লিকেশন > স্টোরেজ : অবচিত ওয়েব SQL বিকল্পটি ( crbug.com/412707590 ) সরানো হয়েছে।
  • উপাদান :
  • নেটওয়ার্ক : Copy as fetch বিকল্প থেকে Referrer-Policy HTTP হেডারটি সরিয়ে ফেলা হয়েছে কারণ এটি ব্রাউজার আচরণ নিয়ন্ত্রণের জন্য একটি প্রতিক্রিয়া হেডার, ক্লায়েন্ট-সাইড নির্দেশনা নয় ( crbug.com/413904896 )।
  • পারফরম্যান্স : কর্মী থ্রেডগুলি থেকে 'দীর্ঘ কাজ' সতর্কতাগুলি সরানো হয়েছে কারণ তারা প্রধান থ্রেডগুলিকে ব্লক করে না ( crbug.com/40248589 )।
  • সমস্যা । এখন রিপোর্ট করে:
    • যদি ব্যবহারকারীদের ট্র্যাক করার সন্দেহভাজন কোনও সংস্থান ব্লক করা হয়।
    • পুনঃনির্দেশের সময় স্টোরেজ অ্যাক্সেস করুক বা না করুক, বাউন্স ট্র্যাকিং মিটিগেশন।
  • অ্যাক্সেসিবিলিটিElements > Styles- এর নিম্নলিখিত উপাদানগুলি এখন কীবোর্ড-ফোকাসযোগ্য:

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

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

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

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

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

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