DevTools এ নতুন কি আছে (Chrome 121)

Sofia Emelianova

নেটওয়ার্ক প্যানেলে স্ট্রীমলাইনড ফিল্টার বার

ফিল্টার বারটি নতুন করে ডিজাইন করা হয়েছে যাতে আপনি অনুরোধগুলিকে সহজে ফিল্টার করতে পারেন এবং নেটওয়ার্ক প্যানেলটিকে ডিক্লাটার করতে পারেন৷

সংশ্লিষ্ট পরীক্ষাটি এই সংস্করণে ডিফল্টরূপে চালু ছিল কিন্তু ফিরিয়ে দেওয়া হবে। আপনি crbug.com/1523150 এ অগ্রগতি ট্র্যাক করতে পারেন।

নতুন ফিল্টার বারে দুটি ড্রপ-ডাউন মেনু রয়েছে: একটি অনুরোধের ধরন বেছে নেওয়ার জন্য এবং অন্যটি ডেটা এবং এক্সটেনশন URL লুকানোর জন্য বা শুধুমাত্র অবরুদ্ধ কুকি এবং অনুরোধগুলি এবং তৃতীয় পক্ষের অনুরোধগুলি দেখানোর জন্য৷ উভয় মেনু বহু-নির্বাচন সমর্থন করে।

পুরানো ফিল্টার বারটি অবিলম্বে ফিরিয়ে আনতে, নেটওয়ার্ক প্যানেলে ফিল্টার বারটির সেটিংস সেটিংস > পরীক্ষা-নিরীক্ষা > check_box_outline_blank পুনরায় ডিজাইন বন্ধ করুন।

crbug.com/1500573 এ বৈশিষ্ট্যটি সম্পর্কে আপনার মতামত নির্দ্বিধায় জানান।

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

উপাদান উন্নতি

@font-palette-values সমর্থন

এলিমেন্টস প্যানেল এখন @font-palette-values ​​CSS at-rule সমর্থন করে। এটি আপনাকে ফন্ট-প্যালেট সম্পত্তির ডিফল্ট মান কাস্টমাইজ করতে দেয়।

শৈলীতে , font-palette সম্পত্তির মান ক্লিক করুন এবং DevTools আপনাকে @font-palette-values ​​ডেডিকেটেড বিভাগে নিয়ে যাবে যেখানে আপনি আপনার কাস্টম মানগুলি সম্পাদনা করতে পারেন।

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

সমর্থিত ক্ষেত্রে: অন্য কাস্টম সম্পত্তির ফলব্যাক হিসাবে কাস্টম সম্পত্তি

Elements > Styles এখন একটি কাস্টম প্রপার্টি সমাধান করে যা অন্য কাস্টম প্রপার্টির ফলব্যাক ।

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

উন্নত উত্স মানচিত্র সমর্থন

সেটিংস Settings > Experiments > check_box সোর্স ম্যাপ ব্যবহার করে এক্সপ্রেশনে পরিবর্তনশীল নাম সমাধান ডিফল্টরূপে চালু করা হয়েছে।

DevTools সোর্স ম্যাপ ব্যবহার করে যাতে আপনি আপনার আসল কোডকে সোর্স এবং স্কোপে ডিবাগ করতে পারেন এমনকি আপনি এটিকে একত্রিত, ছোট বা কম্পাইল করার পরেও। এই পরীক্ষাটি আপনাকে DevTools জুড়ে ধারাবাহিকভাবে আপনার আসল ভেরিয়েবলের নাম মূল্যায়ন করতে দেয়, যার মধ্যে কিন্তু সীমাবদ্ধ নয়:

• কনসোলে অভিব্যক্তি এবং স্বয়ংসম্পূর্ণ পরামর্শ

  

• লাইভ এক্সপ্রেশন

  

• এক্সপ্রেশন দেখুন

  

• শর্তসাপেক্ষ ব্রেকপয়েন্ট এবং লগপয়েন্ট

  

আরো বিস্তারিত জানার জন্য, সংশ্লিষ্ট RFC দেখুন।

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

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

উন্নত ইন্টারঅ্যাকশন ট্র্যাক

পারফরম্যান্স > ইন্টারঅ্যাকশন ট্র্যাক ফিসকার পায় যা প্রক্রিয়াকরণের সময়সীমাতে ইনপুট এবং উপস্থাপনা বিলম্ব নির্দেশ করে।

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

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

বটম-আপ, কল ট্রি এবং ইভেন্ট লগ ট্যাবে উন্নত ফিল্টারিং

পারফরম্যান্স প্যানেলে বটম-আপ , কল ট্রি এবং ইভেন্ট লগ ট্যাবগুলি উন্নত ফিল্টারিংয়ের জন্য তিনটি নতুন বোতাম পেয়েছে:

• ম্যাচ_কেস ম্যাচ কেস ।
• রেগুলার_এক্সপ্রেশন রেগুলার এক্সপ্রেশন ।
• match_word পুরো শব্দ মেলে ।

অতিরিক্তভাবে, আপনাকে প্রসঙ্গ ধরে রাখতে সাহায্য করার জন্য, এখন শুধুমাত্র শীর্ষ স্তরের আইটেমগুলি বটম-আপ ট্যাবের ফিল্টারের সাথে মেলে। পূর্বে, ফিল্টারটি প্রতিটি নোডের সাথে মেলে।

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

উৎস প্যানেলে ইন্ডেন্টেশন মার্কার

উত্স প্যানেলে সম্পাদক এখন আপনার সুবিধার জন্য উল্লম্ব লাইন সহ ইন্ডেন্টেড কোড ব্লকগুলি চিহ্নিত করে৷

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

নেটওয়ার্ক প্যানেলে ওভাররাইড করা হেডার এবং বিষয়বস্তুর জন্য সহায়ক টুলটিপ

নেটওয়ার্ক প্যানেল এখন টুলটিপগুলি দেখায় যখন আপনি একটি অনুরোধের শিরোনাম এবং প্রতিক্রিয়া ট্যাবের পাশে বেগুনি ডট আইকনের উপর হোভার করেন। টুলটিপ আপনাকে বলে যে DevTools দ্বারা কি ওভাররাইড করা হয়েছে।

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

অনুরোধ ব্লকিং প্যাটার্ন যোগ এবং অপসারণের জন্য নতুন কমান্ড মেনু বিকল্প

আপনি এখন কমান্ড মেনুতে নেটওয়ার্ক অনুরোধ ব্লকিং প্যাটার্ন যোগ বা অপসারণ করতে কমান্ড টাইপ করতে পারেন।

অ্যাড কমান্ড আপনাকে প্যাটার্ন নির্দিষ্ট করতে ডায়ালগে নিয়ে যায় এবং রিমুভ কমান্ড নেটওয়ার্ক অনুরোধ ব্লকিং প্যানেল না খুলেই সমস্ত প্যাটার্ন সরিয়ে দেয়।

CSP লঙ্ঘন পরীক্ষা সরানো হয়েছে

89 সংস্করণে প্রবর্তিত পরীক্ষামূলক CSP লঙ্ঘন ট্যাবটি অপ্রয়োজনীয় হিসাবে সরানো হয়েছে।

এক নজরে CSP বিবরণ দেখতে, অ্যাপ্লিকেশন > ফ্রেম > বিষয়বস্তু নিরাপত্তা নীতি (CSP) এ নেভিগেট করুন।

উপরন্তু, সমস্যা প্যানেল CSP লঙ্ঘনের রিপোর্ট করে।

বাতিঘর 11.3.0

Lighthouse প্যানেল এখন Lighthouse 11.3.0 চালায়। পরিবর্তনের সম্পূর্ণ তালিকা দেখুন। উল্লেখযোগ্য পরিবর্তনগুলির মধ্যে 404 পৃষ্ঠায় রিপোর্ট চালানোর ক্ষমতা।

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

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

অ্যাক্সেসযোগ্যতা

এই সংস্করণে নিম্নলিখিত অ্যাক্সেসযোগ্যতার উন্নতি রয়েছে:

• নেটওয়ার্ক > পেলোডে , আপনি এখন ভিউ সোর্স ট্যাব-ফোকাস করতে পারেন এবং ইউআরএল-এনকোড করা বোতাম দেখতে পারেন এবং সংশ্লিষ্ট অ্যাকশনটি ট্রিগার করতে এন্টার বা স্পেস টিপুন।
• কনসোলে , বিভ্রান্তি কমাতে, ডিবাগারের কাছে আর উপলব্ধ নেই এমন স্ক্রিপ্টগুলির দিকে নিয়ে যাওয়া লিঙ্কগুলি এখন ধূসর হয়ে গেছে এবং ক্লিক করা যাবে না৷
• নেভিগেশন ট্রিতে, যেমন Sources > Page এ ট্রি , এন্টার কী এখন বাচ্চাদের সাথে নোডগুলিকে প্রসারিত করে এবং ভেঙে পড়ে।

ক্রোমিয়াম সমস্যা: 1338391 , 1500662 , 1420362 ।

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

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

• কর্মক্ষমতা যদি একটি রেকর্ডিং ব্যর্থ হয়, আপনার কাছে এখন কাঁচা ট্রেস ইভেন্টগুলি ডাউনলোড করার বিকল্প রয়েছে এবং কী ভুল হয়েছে তা খুঁজে বের করার চেষ্টা করুন ( কমিট )।
• শো কনসোল শর্টকাট ( ম্যাকের জন্য Ctrl + ` , উইন্ডোজ এবং লিনাক্সের জন্য Ctrl + + ) এখন কেবল কনসোল খোলে না কিন্তু দ্বিতীয়বার চাপলে বন্ধও হয়ে যায়।
• বিকাশকারী সংস্থান । একটি বাগ সংশোধন করা হয়েছে যা CSS সংস্থান এবং তাদের সমস্যাগুলি রিপোর্ট করতে বাধা দেয় ( 1420362 )।
• উপাদান :
  • iframes ( 1453375 ) এ পরিদর্শন উপাদান সহ একটি বাগ সংশোধন করা হয়েছে।
  • গণনা করা হয়েছে । একটি বাগ সংশোধন করা হয়েছে যা ডিফল্ট মানকে রেন্ডারিং থেকে বাধা দেয় ( 1499882 )।
  • অনুসন্ধান করুন একটি বাগ সংশোধন করা হয়েছে যা এক বা দুটি অক্ষরের সংক্ষিপ্ত প্রশ্নের জন্য মিলের সংখ্যা গণনা করতে বাধা দেয় ( 1416457 )।
• কনসোল এখন সঠিকভাবে রেগুলার এক্সপ্রেশন পার্স করে যা ফিল্টার বক্সে ( 1346936 ) এস্কেপড ক্যারেক্টার দিয়ে শেষ হয়।
• সেটিংস > ওয়ার্কস্পেস । একটি বাগ সংশোধন করা হয়েছে যা একটি বাদ দেওয়া ফোল্ডার ( 1503580 ) যোগ করতে বাধা দেয়।
• নেটওয়ার্ক > পূর্বরূপ । এখন data: URIs ( 1381791 )।
• স্মৃতি । অ্যাকশন বারে সঠিক আপলোড লোড এবং ডাউনলোড সেভ বোতাম যোগ করা হয়েছে ( 1275407 )।

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

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

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

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

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

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

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