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

Sofia Emelianova

রেকর্ডার এক্সটেনশনের অফিসিয়াল সংগ্রহ লাইভ

এক্সপোর্ট এবং রিপ্লে রেকর্ডার এক্সটেনশনের অফিসিয়াল সংগ্রহ এখন লাইভ।

রেকর্ডার থেকে সরাসরি সংগ্রহ খুলতে, রেকর্ডার প্যানেলের শীর্ষে অ্যাকশন বারে ডাউনলোড রপ্তানি > এক্সটেনশন পান... নির্বাচন করুন।

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

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

স্ট্যাটাস কলামে ব্যর্থতার কারণ

স্থিতি কলাম এখন সর্বদা একটি ব্যর্থতার কারণ দেখায়। পূর্বে, আপনাকে চেক_বক্স বড় অনুরোধ সারি চালু করতে হবে বা টেবিলে অনুরোধটি নির্বাচন করতে হবে।

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

উন্নত অনুলিপি সাবমেনু

একটি অনুরোধের অনুলিপি সাবমেনু এখন আরও ভালভাবে সংগঠিত।

অতিরিক্তভাবে, CURL হিসাবে অনুলিপি বিকল্পটি এখন উইন্ডোজের ক্লিপবোর্ডে সঠিক কমান্ডটি অনুলিপি করে।

ক্রোমিয়াম সমস্যা: 1267033 , 1276452 , 798498 ।

কর্মক্ষমতা উন্নতি

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

টাইমলাইনে ব্রেডক্রাম্বস

পারফরম্যান্স প্যানেলের শীর্ষে থাকা টাইমলাইন এখন আপনাকে ব্রেডক্রাম্ব সেট করতে এবং তাদের মধ্যে লাফ দিতে দেয়।

একটি ব্রেডক্রাম্ব সেট করতে, টাইমলাইনে একটি রেঞ্জ নির্বাচন করুন, এটির উপর হোভার করুন এবং N ms zoom_in বোতামে ক্লিক করুন। আপনি পর পর বেশ কয়েকটি নেস্টেড ব্রেডক্রাম্ব তৈরি করতে পারেন। জুম লেভেলের মধ্যে লাফ দিতে, টাইমলাইনের উপরে চেইনের সংশ্লিষ্ট ব্রেডক্রাম্বে ক্লিক করুন। ব্রেডক্রাম্বগুলিকে কার্যকর দেখতে পরবর্তী ভিডিওটি দেখুন।

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

প্রধান ট্র্যাক ইভেন্ট ইনিশিয়েটর

পারফরম্যান্স > মূল ট্র্যাক ডিফল্টরূপে এখন তীরগুলিকে সংযোগকারী সূচনাকারীদের এবং তাদের দ্বারা সৃষ্ট নিম্নলিখিত ইভেন্টগুলি দেখায়।

• শৈলী বা বিন্যাস অবৈধকরণ -> শৈলী বা বিন্যাস পুনরায় গণনা করুন
• অ্যানিমেশন ফ্রেম অনুরোধ -> অ্যানিমেশন ফ্রেম ফায়ার করা হয়েছে
• নিষ্ক্রিয় কলব্যাকের অনুরোধ করুন -> ফায়ার আইডল কলব্যাক
• টাইমার ইনস্টল করুন -> টাইমার ফায়ারড
• ওয়েবসকেট তৈরি করুন -> পাঠান... এবং ওয়েবসকেট হ্যান্ডশেক গ্রহণ করুন বা ওয়েবসকেট ধ্বংস করুন

তীরগুলি দেখতে, ট্রেসে এমন একটি ইভেন্ট খুঁজুন এবং এটিতে ক্লিক করুন৷ পূর্বে, এই বৈশিষ্ট্য একটি পরীক্ষা ছিল.

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

Node.js DevTools-এর জন্য JavaScript VM ইনস্ট্যান্স সিলেক্টর মেনু

Node.js DevTools-এর পারফরম্যান্স প্যানেলে, আপনি এখন অ্যাকশন বারে সংশ্লিষ্ট ড্রপ-ডাউন মেনু থেকে একটি JavaScript VM ইন্সট্যান্স নির্বাচন করতে পারেন। একটি অনুরূপ বৈশিষ্ট্য শীঘ্রই হতে-বঞ্চিত JavaScript প্রোফাইলারে উপলব্ধ ছিল৷

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

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

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

পরবর্তী দুটি বৈশিষ্ট্য ছাড়াও, এলিমেন্টস প্যানেলটি এখন আপনার খোলা শেষ ট্যাবটি মনে রাখে, উদাহরণস্বরূপ Computed বা Properties ।

::view-transition সিউডো-এলিমেন্ট এখন শৈলীতে সম্পাদনাযোগ্য

আপনি এখন ইন্সপেক্টর স্টাইল শীট ব্যবহার করে স্টাইলগুলিতে ::view-transition CSS ছদ্ম-উপাদানগুলি সম্পাদনা করতে পারেন।

আরও তথ্যের জন্য, ভিউ ট্রানজিশন API এর সাথে মসৃণ এবং সহজ রূপান্তরগুলি দেখুন।

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

ব্লক কন্টেইনারগুলির জন্য align-content সম্পত্তি সমর্থন

align-content বৈশিষ্ট্য এখন table-caption এবং table-cell সহ যেকোনো ব্লক পাত্রে কাজ করে। পূর্বে, এটি শুধুমাত্র গ্রিড এবং ফ্লেক্সের সাথে কাজ করত।

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

উৎসে নতুন শর্টকাট এবং কমান্ড

আপনি এখন Cmd (Mac) / Ctrl (Win) + Shift + একটি লগপয়েন্ট তৈরি করতে উত্সের একটি লাইন নম্বরে ক্লিক করতে পারেন। এই শর্টকাটটি ইতিমধ্যে বিদ্যমান Cmd (Mac) / Ctrl (Win) + শর্তসাপেক্ষ ব্রেকপয়েন্টের জন্য ক্লিকের একটি সংযোজন।

কমান্ড মেনু নেভিগেটর সাইডবার কমান্ডে নতুন রিভিল সক্রিয় ফাইল পায় যা এডিটরের ড্রপ-ডাউন মেনুতে সংশ্লিষ্ট বিকল্পের মতোই করে।

ক্রোমিয়াম সমস্যা: 1486933 , 1467464 ।

অনুকরণীয় ভাঁজযোগ্য ডিভাইসের জন্য ভঙ্গি সমর্থন

ডিভাইস মোড এখন আপনাকে একটি অনুকরণযোগ্য ভাঁজযোগ্য ডিভাইসের ভঙ্গি সেট করতে দেয়: ক্রমাগত বা ভাঁজ করা । ক্রমাগত ভঙ্গি একটি "সমতল" অবস্থানকে বোঝায় এবং ভাঁজ প্রদর্শনের অংশগুলির মধ্যে একটি কোণ তৈরি করে।

উপরন্তু, ডিভাইস তালিকা একটি নতুন অনুকরণযোগ্য ভাঁজযোগ্য ডিভাইস পায়: Asus Zenbook Fold।

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

গতিশীল থিমিং

DevTools এখন স্বয়ংক্রিয়ভাবে Chrome-এর রঙের থিমের সাথে মেলে। একটি থিম সেট করতে:

1. একটি নতুন ট্যাব খুলুন এবং ডান নীচের কোণায় কাস্টমাইজ ক্রোম সম্পাদনা করুন ক্লিক করুন৷
2. চেহারাতে, ওয়ালপেপারের মাধ্যমে একটি থিম বেছে নিন থিম পরিবর্তন করুন বা একটি রঙ প্যালেট নির্বাচন করুন।

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

নেটওয়ার্ক এবং অ্যাপ্লিকেশন প্যানেলে তৃতীয় পক্ষের কুকি ফেজআউট সতর্কতা

নেটওয়ার্ক এবং অ্যাপ্লিকেশন প্যানেল উভয়ই এখন হাইলাইট করে এবং ট্র্যাকিং সুরক্ষা থেকে তৃতীয় পক্ষের বিধিনিষেধ দ্বারা প্রভাবিত কুকিজের পাশে সতর্কতা দেখায়।

নেটওয়ার্কে , একটি সতর্কতা সতর্কতা আইকন সহ একটি অনুরোধ খুঁজুন, এটিতে ক্লিক করুন এবং কুকিজ ট্যাব খুলুন।

অ্যাপ্লিকেশনে , স্টোরেজ > কুকিজে নেভিগেট করুন এবং একটি ডোমেনে ক্লিক করুন। হলুদে হাইলাইট করা কুকি ব্রাউজারে সংরক্ষণ করা হয় না।

সমস্যাগুলি বর্ণনা করে একটি টুলটিপ দেখতে সতর্কীকরণ আইকনের উপর হোভার করুন এবং আরও তথ্য সহ সমস্যা ট্যাব খুলতে আইকনে ক্লিক করুন৷

অতিরিক্তভাবে, টেবিলের কুকিগুলি এখন ডিফল্টভাবে নাম অনুসারে সাজানো হয়।

ক্রোমিয়াম সমস্যা: 1506225 , 1503961 ।

বাতিঘর 11.4.0

Lighthouse প্যানেল এখন Lighthouse 11.4.0 চালায়। পরিবর্তনের সম্পূর্ণ তালিকা দেখুন। উল্লেখযোগ্য পরিবর্তনগুলির মধ্যে রয়েছে নতুন অডিট যা আপনাকে সনাক্ত করতে দেয় যে আপনার ওয়েবসাইট এখনও তৃতীয় পক্ষের কুকি ব্যবহার করে কিনা।

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

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

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

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

• আপনি সেটিংস সেটিংস > পরীক্ষা-নিরীক্ষা খুললে, অনুসন্ধান বাক্সটি এখন স্বয়ংক্রিয়ভাবে ফোকাসে থাকে।
• নেটওয়ার্ক > ফিল্টারে ক্যান্সেল ক্লিয়ার ইনপুট বোতামটি এখন ফোকাসযোগ্য।
• সোর্স > পৃষ্ঠার ফাইল ট্রি এখন উচ্চ কনট্রাস্ট মোডে সঠিকভাবে প্রদর্শন করে।
• স্ক্রীন রিডাররা এখন সঠিকভাবে নিম্নলিখিত ঘোষণা করে:
  • উৎস > ব্রেকপয়েন্টে চেকবক্সের অবস্থা।
  • পরামর্শের তালিকার জন্য অবস্থান এবং সূচক তথ্য।
  • সেটিংস সেটিংস > অবস্থানে একটি অবস্থান যোগ বা মুছে ফেলার সময় কর্মের ফলাফল।
  • সেটিংস সেটিংস > উপেক্ষা তালিকায় বর্জন নিয়মের গ্রুপ (সাধারণ বা কাস্টম)।

ক্রোমিয়াম সমস্যা: 1504938 , 1499868 , 1512161 , 1515224 , 1515418 , 1516998 , 1517015 ।

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

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

• অ্যানিমেশন :
  • স্ক্রিনশট পপওভার সীমার বাইরে রেন্ডারিং সহ বাগ সংশোধন করা হয়েছে ( 1506991 )।
  • সরানো অ্যানিমেশন নোডগুলি সরানো হিসাবে চিহ্নিত করা হয়নি এমন বাগ সংশোধন করা হয়েছে ( 1506561 )।
• নেটওয়ার্ক :
  • হেডার ওভাররাইড : হেডার ট্যাবে একটি মিথ্যা বেগুনি ডট আইকন সহ একটি বাগ সংশোধন করা হয়েছে ( 1507856 )।
  • পূর্বরূপ : একটি অপ্রয়োজনীয় ডবল ডিকোডিং ( 1509336 ) সহ একটি বাগ সংশোধন করা হয়েছে।
  • একটি বাগ সংশোধন করা হয়েছে যার কারণে সংক্ষিপ্ত অনুরোধগুলি দেখা যায়নি ( 1509862 )।
• অ্যাপ্লিকেশন > IndexedDB : অন্যান্য প্যানেলের সাথে সামঞ্জস্যের জন্য অ্যাকশন বারে পুনরায় সাজানো বোতামগুলি ( 1393800 )।
• সেন্সর : অনুপলব্ধ অবস্থান ভুল সফল কলব্যাক ( 1486859 ) সহ একটি বাগ সংশোধন করা হয়েছে।
• কর্মক্ষমতা :
  • আবর্জনা সংগ্রহ করুন বোতামে এখন একটি উপযুক্ত আইকন রয়েছে, একটি "বিন" ( 1507530 ) এর পরিবর্তে "mop"।
  • about:blank ( 1509947 ) এ নেভিগেট করার সময় কার্যক্ষমতা ট্রেস এখন ডেটা ধরে রাখে।

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

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

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

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

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

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

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