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

Jecelyn Yeen

নতুন CSS দৈর্ঘ্যের অথরিং টুল

CSS-এ দৈর্ঘ্য আপডেট করার জন্য DevTools একটি সহজ কিন্তু নমনীয় উপায় যোগ করেছে!

স্টাইলস প্যানে, দৈর্ঘ্য সহ যেকোনো CSS প্রোপার্টি খুঁজুন (যেমন height , padding )।

ইউনিট টাইপের উপর কার্সার রাখুন, এবং লক্ষ্য করুন যে ইউনিট টাইপটি আন্ডারলাইন করা হয়েছে। ড্রপডাউন থেকে একটি ইউনিট টাইপ নির্বাচন করতে এটিতে ক্লিক করুন।

ইউনিট মানের উপর কার্সার রাখুন, এবং আপনার মাউস পয়েন্টারটি অনুভূমিক কার্সারে পরিবর্তিত হবে। মান বাড়াতে বা কমাতে অনুভূমিকভাবে টেনে আনুন। মানটি 10 ​​দ্বারা সামঞ্জস্য করতে, টেনে আনার সময় Shift কী ধরে রাখুন।

আপনি এখনও ইউনিট মানটি টেক্সট হিসেবে সম্পাদনা করতে পারেন — শুধু মানটিতে ক্লিক করুন এবং সম্পাদনা শুরু করুন।

ক্রোমিয়াম সমস্যা: ১১২৬১৭৮ , ১১৭২৯৯৩

"সমস্যা" ট্যাবে সমস্যাগুলি লুকান

এখন আপনি "সমস্যা" ট্যাবে নির্দিষ্ট সমস্যাগুলি লুকিয়ে রাখতে পারেন যাতে শুধুমাত্র আপনার কাছে গুরুত্বপূর্ণ বিষয়গুলিতে ফোকাস করা যায়।

সমস্যা ট্যাবে , আপনি যে সমস্যাটি লুকাতে চান তার উপর কার্সার রাখুন। আরও বিকল্পগুলিতে ক্লিক করুন। > এই ধরণের সমস্যা লুকান ।

লুকানো সমস্যাগুলির তালিকা "লুকানো সমস্যা" প্যানেলের অধীনে সমস্ত লুকানো সমস্যা যুক্ত করা হবে। প্যানেলটি প্রসারিত করুন। আপনি সমস্ত লুকানো সমস্যা অথবা নির্বাচিত একটি সমস্যা প্রদর্শন করতে পারেন।

ক্রোমিয়াম সমস্যা: ১১৭৫৭২২

বৈশিষ্ট্যের প্রদর্শন উন্নত করা হয়েছে

DevTools নিম্নলিখিত উপায়ে বৈশিষ্ট্যের প্রদর্শন উন্নত করে:

• কনসোল , সোর্স প্যানেল এবং প্রোপার্টিজ প্যানে সর্বদা বোল্ড করুন এবং প্রথমে নিজস্ব প্রোপার্টিজ সাজান।
• প্রোপার্টিজ প্যানে প্রোপার্টিজ ডিসপ্লে সমতল করুন।

উদাহরণস্বরূপ, নীচের স্নিপেটটি 2টি নিজস্ব বৈশিষ্ট্য সহ একটি URL অবজেক্ট link তৈরি করে: user এবং access , এবং একটি উত্তরাধিকারসূত্রে প্রাপ্ত সম্পত্তি search মান আপডেট করে।

/* example.js */

const link = new URL('https://goo.gle/devtools-blog');

link.user = { id: 1, name: 'Jane Doe' };
link.access = 'admin';
link.search = `?access=${link.access}`;

কনসোলে লগিং link চেষ্টা করুন। নিজস্ব বৈশিষ্ট্যগুলি এখন বোল্ড এবং প্রথমে সাজানো হয়েছে। এই পরিবর্তনগুলি কাস্টম বৈশিষ্ট্যগুলি সনাক্ত করা সহজ করে তোলে, বিশেষ করে ওয়েব API গুলির জন্য (যেমন URL ) যেখানে অনেক উত্তরাধিকারসূত্রে প্রাপ্ত বৈশিষ্ট্য রয়েছে।

এই পরিবর্তনগুলি ছাড়াও, প্রোপার্টিজ প্যানের প্রোপার্টিগুলি এখন আরও ভালো DOM প্রোপার্টি ডিবাগিং অভিজ্ঞতার জন্য সমতল করা হয়েছে, বিশেষ করে ওয়েব কম্পোনেন্টগুলির জন্য।

ক্রোমিয়াম সমস্যা: 1076820 , 1119900

লাইটহাউস প্যানেলে লাইটহাউস 8.4

লাইটহাউস প্যানেলটি এখন লাইটহাউস 8.4 চালাচ্ছে। লাইটহাউস এখন সনাক্ত করবে যে লার্জেস্ট কন্টেনফুল পেইন্ট (LCP) উপাদানটি একটি অলস-লোডেড ছবি ছিল কিনা এবং এটি থেকে loading অ্যাট্রিবিউটটি সরানোর পরামর্শ দেবে।

আপডেট সম্পর্কে আরও বিস্তারিত জানার জন্য Lighthouse 8.4-এ নতুন কী আছে তা দেখুন।

ক্রোমিয়াম সমস্যা: ৭৭২৫৫৮

সোর্স প্যানেলে স্নিপেটগুলি সাজান

সোর্স প্যানেলের অধীনে স্নিপেটস প্যানের স্নিপেটগুলি এখন বর্ণানুক্রমিকভাবে সাজানো হয়েছে। পূর্বে, এটি সাজানো হত না।

কমান্ড দ্রুত চালানোর জন্য স্নিপেটস বৈশিষ্ট্যটি ব্যবহার করুন। টিপস জানতে এই ভিডিওটি দেখুন!

ক্রোমিয়াম সমস্যা: ১২৪৩৯৭৬

অনুবাদিত রিলিজ নোটের নতুন লিঙ্ক এবং একটি অনুবাদ বাগ রিপোর্ট করুন

আপনি এখন "নতুন কী" ট্যাবের মাধ্যমে DevTools রিলিজ নোটগুলি আরও ৬টি ভাষায় পড়তে ক্লিক করতে পারেন - রাশিয়ান , চীনা , স্প্যানিশ , জাপানি , পর্তুগিজ এবং কোরিয়ান ।

Chrome 94 থেকে, আপনি DevTools-এ আপনার পছন্দের ভাষা সেট করতে পারেন। অনুবাদের ক্ষেত্রে যদি আপনি কোনও সমস্যা পান, তাহলে More options > Help > Translation Bug Report এর মাধ্যমে অনুবাদের সমস্যা রিপোর্ট করে এটি উন্নত করতে আমাদের সাহায্য করুন।

ক্রোমিয়াম সমস্যা: 1246245 , 1245481

DevTools কমান্ড মেনুর জন্য উন্নত UI

কমান্ড মেনুতে ফাইল খুঁজতে কি আপনার অসুবিধা হয়েছে? আপনার জন্য সুখবর, কমান্ড মেনু ইউজার ইন্টারফেস এখন উন্নত!

উইন্ডোজ এবং লিনাক্সে কীবোর্ড শর্টকাট কন্ট্রোল + পি , অথবা ম্যাকওএসে কমান্ড + পি দিয়ে ফাইল অনুসন্ধান করতে কমান্ড মেনু খুলুন।

কমান্ড মেনুর UI উন্নতি এখনও চলছে, আরও আপডেটের জন্য আমাদের সাথেই থাকুন!

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

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

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

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

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

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

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

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