DevTools, Chrome 125-এ নতুন কী রয়েছে৷

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

মিথুনের সাথে কনসোলের ত্রুটি এবং সতর্কতাগুলি আরও ভালভাবে বুঝুন

এই Chrome সংস্করণটি DevTools Console- এ জেনারেটিভ AI ক্ষমতা নিয়ে আসে, যার লক্ষ্য আপনার সম্মুখীন হওয়া ত্রুটি এবং সতর্কতা সম্পর্কে আরও ভালভাবে বোঝার জন্য।

একটি ত্রুটি বা সতর্কতার একটি AI-জেনারেটেড ব্যাখ্যা পেতে, ক্লিক করুন লাইটবাল্ব স্পার্ক। কনসোলে বার্তার পাশে এই ত্রুটি (সতর্কতা) বোতামটি বুঝুন এবং নির্দেশাবলী অনুসরণ করুন।

একটি ত্রুটির AI-উত্পন্ন ব্যাখ্যা৷

আরও তথ্যের জন্য, AI এর সাথে আরও ভালভাবে ত্রুটি এবং সতর্কতা বুঝুন দেখুন।

@position-try নিয়মগুলি উপাদান > শৈলীতে সমর্থন করে

CSS অ্যাঙ্কর পজিশনিং ডিবাগ করতে সাহায্য করার জন্য, Elements > Styles ট্যাব এখন @position-try CSS নিয়ম সমর্থন করে। ট্যাব position-try-options মানগুলি সমাধান করে এবং প্রতিটি বিকল্পকে একটি ডেডিকেটেড @position-try --name বিভাগে লিঙ্ক করে।

@position-try CSS নিয়ম সমর্থন করার আগে এবং পরে।

আরও জানতে, সিএসএস অ্যাঙ্কর পজিশনিং API প্রবর্তন দেখুন।

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

উত্স প্যানেল উন্নতি

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

স্বয়ংক্রিয় প্রিটি-প্রিন্টিং এবং বন্ধনী ক্লোজিং কনফিগার করুন

আপনি এখন উত্সগুলিতে সম্পাদকের জন্য স্বয়ংক্রিয় প্রিটি-প্রিন্টিং এবং বন্ধনী বন্ধ বা চালু বা বন্ধ করতে পারেন৷ প্রিটি-প্রিন্টিং ছোট ফাইলগুলিকে পাঠযোগ্য করে তোলে। বন্ধনী ক্লোজিং স্বয়ংক্রিয়ভাবে একটি ক্লোজিং বন্ধনী ( ) বা } ) বা ট্যাগ ( > ) যোগ করে যখন আপনি একটি খোলার টাইপ করেন।

প্রাসঙ্গিক আচরণ কনফিগার করতে, নতুন চেক করুন বা সাফ করুন স্বয়ংক্রিয় বন্ধনী বন্ধনী এবং স্বয়ংক্রিয়ভাবে প্রিন্ট মিনিফাইড সোর্স বিকল্পগুলি > পছন্দ > উত্সগুলিতে

স্বয়ংক্রিয় প্রিটি-প্রিন্টিং এবং বন্ধনী বন্ধ করার জন্য নতুন সেটিংস যোগ করার আগে এবং পরে।

ক্রোমিয়াম সমস্যা: 40865010 , 324314570

হ্যান্ডেল প্রত্যাখ্যান প্রতিশ্রুতি ধরা হিসাবে স্বীকৃত হয়

সোর্স প্যানেল এখন সঠিকভাবে প্রত্যাখ্যান করা প্রতিশ্রুতিগুলিকে ধরা হিসাবে স্বীকৃতি দেয় যদি আপনি সেগুলিকে .catch() বা টু-আর্গুমেন্ট .then() দিয়ে পরিচালনা করেন।

অন্য কথায়, যখন উৎস > ব্রেকপয়েন্ট > পজ অন না ধরা ব্যতিক্রম চালু করা হয়, ডিবাগার নিচের মত বিবৃতিতে বিরতি দেবে না:

Promise.reject(new Error('fail')).catch((e)=>console.log('caught'));

আগে এবং পরে ধরা প্রত্যাখ্যান.

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

কনসোলে ত্রুটির কারণ

কনসোল এখন আপনাকে স্ট্যাক ট্রেসে ত্রুটির কারণগুলির চেইন দেখায়, যদি থাকে।

ডিবাগিং সহজ করার জন্য, আপনি ত্রুটিগুলি ধরা এবং পুনরায় নিক্ষেপ করার সময় ত্রুটির কারণগুলি নির্দিষ্ট করতে পারেন৷ যেহেতু কনসোল কারণ চেইনে চলে যায়, এটি প্রতিটি ত্রুটির স্ট্যাককে Caused by: প্রিফিক্স দিয়ে প্রিন্ট করে, যাতে আপনি এখনও আসল ত্রুটিটি দেখতে পারেন।

প্রিন্টিং এর আগে এবং পরে স্ট্যাক ট্রেস এর সাথে `Caused by` উপসর্গ।

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

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

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

প্রারম্ভিক ইঙ্গিত শিরোনাম পরিদর্শন করুন

প্রারম্ভিক ইঙ্গিত শিরোনামগুলি নেটওয়ার্ক প্যানেলের অনুরোধের শিরোনাম ট্যাবে একটি উত্সর্গীকৃত বিভাগ পায়। পূর্বে, আপনি রেসপন্স হেডার বিভাগে প্রাসঙ্গিক শিরোনাম খুঁজে পেতে পারেন।

Early Hints হল একটি HTTP স্ট্যাটাস কোড ( 103 Early Hints ) যা একটি চূড়ান্ত প্রতিক্রিয়ার আগে একটি প্রাথমিক HTTP প্রতিক্রিয়া পাঠাতে ব্যবহৃত হয়। এটি একটি সার্ভারকে গুরুত্বপূর্ণ সাব-রিসোর্স (উদাহরণস্বরূপ, একটি স্টাইল শীট বা সমালোচনামূলক জাভাস্ক্রিপ্ট) বা মূল উৎস সম্পর্কে ব্রাউজারে ইঙ্গিত পাঠাতে দেয় যা সম্ভবত পৃষ্ঠাটি ব্যবহার করবে, যখন সার্ভার প্রধান সংস্থান তৈরি করতে ব্যস্ত থাকে।

প্রারম্ভিক ইঙ্গিতগুলির জন্য একটি উত্সর্গীকৃত বিভাগ যোগ করার আগে এবং পরে৷

আরও তথ্যের জন্য, প্রারম্ভিক ইঙ্গিত সহ সার্ভার থিঙ্ক-টাইম ব্যবহার করে দ্রুত পৃষ্ঠা লোড দেখুন।

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

জলপ্রপাত কলাম লুকান

আপনি এখন নেটওয়ার্ক প্যানেলে জলপ্রপাত কলাম লুকাতে পারেন যেভাবে আপনি অন্যান্য কলামগুলিকে লুকাতে পারেন। যেকোনো কলামের নামে ডান-ক্লিক করুন এবং ড্রপ-ডাউন মেনুতে জলপ্রপাত চেকবক্সটি সাফ করুন।

আগে এবং পরে জলপ্রপাত কলাম লুকানোর বিকল্প যোগ করুন.

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

কর্মক্ষমতা প্যানেল উন্নতি

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

CSS নির্বাচক পরিসংখ্যান ক্যাপচার করুন

পারফরম্যান্স প্যানেল একটি নতুন সেটিং পায় যা আপনাকে দীর্ঘ-চলমান পুনঃগণনা শৈলী ইভেন্টগুলির জন্য CSS নির্বাচক পরিসংখ্যান ক্যাপচার করতে দেয়।

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

নির্বাচক পরিসংখ্যান যোগ করার আগে এবং পরে।

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

অর্ডার পরিবর্তন করুন এবং ট্র্যাক লুকান

পারফরম্যান্স প্যানেল একটি নতুন কনফিগারেশন মোড পায় যা আপনাকে ট্র্যাকের ক্রম পরিবর্তন করতে এবং সেগুলি লুকিয়ে রাখতে দেয়৷

কনফিগারেশন মোডে প্রবেশ করতে, ট্র্যাক নামের বাম দিকে সম্পাদনা বোতামে ক্লিক করুন। তারপরে ট্র্যাকটি চারপাশে সরানোর জন্য বা নিচের নীচে ক্লিক করুন বা লুকাতে ক্লিক করুন। আপনার কাজ শেষ হয়ে গেলে ট্র্যাক নামের ডানদিকে চেক বোতামটি ক্লিক করুন।

পরবর্তী সংস্করণ, Chrome 126, এই UI-তে আরও উন্নতি আনবে৷

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

মেমরি প্যানেলে ধারকদের উপেক্ষা করুন

আপনি এখন মেমরি প্যানেলের মাধ্যমে ক্যাপচার করা হিপ স্ন্যাপশটগুলিতে ধারকদের উপেক্ষা করতে পারেন।

একটি ধারককে উপেক্ষা করতে, একটি বস্তু নির্বাচন করুন এবং, ধারক বিভাগে, একটি ধারককে ডান-ক্লিক করুন এবং ড্রপ-ডাউন মেনু থেকে এই ধারকটিকে উপেক্ষা করুন নির্বাচন করুন। উপেক্ষিত ধারকদের দূরত্ব কলামে ignored মান দিয়ে চিহ্নিত করা হয়। উপেক্ষা করা বন্ধ করতে, উপরের অ্যাকশন বারে উপেক্ষা করা রিটেইনার পুনরুদ্ধার করুন ক্লিক করুন।

ধারকদের উপেক্ষা করার জন্য একটি বিকল্প যোগ করার আগে এবং পরে।

অতিরিক্তভাবে, হিপ স্ন্যাপশটগুলি এখন একটি বড় সংখ্যক (শত মিলিয়ন) কন্টেনমেন্ট প্রান্ত এবং নোড ( 332350576 ) সমর্থন করে।

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

বাতিঘর 11.7.1

Lighthouse প্যানেল এখন Lighthouse 11.7.1 চালায়। পরিবর্তনের সম্পূর্ণ তালিকা দেখুন।

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

প্রকাশক বিজ্ঞাপন প্লাগইন সমর্থন অপসারণ যোগ করার আগে এবং পরে.

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

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

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

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

  • রেকর্ডার প্যানেলটি এখন আনুষ্ঠানিকভাবে পূর্বরূপ অবস্থার বাইরে ( 329271496 )।
  • কনসোল এখন কোনো ত্রুটি দেখায় না যখন একটি কাস্টম ফরম্যাটার body() ফাংশনের জন্য একটি null প্রদান করে, যা একটি বৈধ আচরণ ( 329400119 )।
  • সোর্স প্যানেল আপডেট করা সিনট্যাক্স হাইলাইটার, বিশেষ করে, এটি এখন নিয়মিত এক্সপ্রেশনে v এবং d পতাকা সমর্থন করে।
  • নেটওয়ার্ক > কুকিজ ট্যাবটি রেসপন্স কুকিজ ( 41491846 ) থেকে অব্যাহতিপ্রাপ্ত কুকিজ ম্যাপিং সহ একটি বাগ সংশোধন করেছে।
  • উপাদান > শৈলী ট্যাব এখন নিম্নলিখিত কাজ করে:
    • কাস্টম বৈশিষ্ট্য ( 41489874 ) সহ সম্পূর্ণ-ওভারলোডেড উত্তরাধিকার সূত্র দেখায়।
    • রঙের থিম ( 331123816 ) এর উপর নির্ভর করে হালকা-অন্ধকার() এ প্রয়োগ করা মান হাইলাইট করে।

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

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

Chrome DevTools টিমের সাথে যোগাযোগ করা হচ্ছে

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

  • crbug.com এর মাধ্যমে আমাদের কাছে একটি পরামর্শ বা প্রতিক্রিয়া জমা দিন।
  • আরও বিকল্প ব্যবহার করে একটি DevTools সমস্যা রিপোর্ট করুনআরও > সাহায্য > DevTools-এ একটি DevTools সমস্যা রিপোর্ট করুন
  • @ChromeDevTools- এ টুইট করুন।
  • আমাদের DevTools YouTube ভিডিও বা DevTools টিপস YouTube ভিডিওগুলিতে নতুন কী আছে সে সম্পর্কে মন্তব্য করুন৷

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

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