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

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

Google I/O 2025 সংস্করণ

Chrome DevTools এই বছরের Google I/O-এ একটি শক্তিশালী উপস্থিতি পেতে চলেছে৷ লাইভ সেশন এবং রেকর্ড করা সেশনের মিশ্রণ হতে যাচ্ছে।

উত্তেজনাপূর্ণ নতুন বৈশিষ্ট্য সম্পর্কে জানতে, নিম্নলিখিত টিউন করুন:

অতিরিক্তভাবে, রেচেল অ্যান্ড্রু'স ওয়েব সেশনে নতুন কী আছে তা টিউন করতে ভুলবেন না , 20 মে, 2025 | বিকাল 4:30 পিটি।

আমাদের সাম্প্রতিক হাইলাইটগুলির একটি দ্রুত ওভারভিউ জন্য আমাদের সর্বশেষ ভিডিও দেখুন:

মিথুনের সাথে আপনার কর্মক্ষেত্রে CSS পরিবর্তনগুলি সংশোধন এবং সংরক্ষণ করুন

কয়েকটি ক্লিকের মাধ্যমে, আপনি এখন আপনার জন্য জেমিনি সংশোধন করতে পারেন এবং আপনার জন্য CSS ঠিক করতে পারেন এবং একটি সংযুক্ত ওয়ার্কস্পেস ফোল্ডারের সাহায্যে আপনার পরিবর্তনগুলিকে আপনার কম্পিউটারে সোর্স ফাইলগুলিতে সংরক্ষণ করতে পারেন৷

স্বয়ংক্রিয় কর্মক্ষেত্র একটি পরীক্ষামূলক বৈশিষ্ট্য। আপনি আপনার বিদ্যমান উৎস ফোল্ডার সংযোগ করতে পারেন অথবা আপনি একটি ডেমো চেষ্টা করতে পারেন.

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

একটি ওয়ার্কস্পেস ফোল্ডার সংযুক্ত করুন এবং আপনার সোর্স ফাইলগুলিতে পরিবর্তনগুলি সংরক্ষণ করুন৷

আপনি এখন স্বয়ংক্রিয়ভাবে (বা ম্যানুয়ালি) একটি ওয়ার্কস্পেস ফোল্ডার কানেক্ট করতে পারেন যাতে DevTools আপনার কম্পিউটারে সঞ্চিত সোর্স ফাইলগুলিতে JavaScript, HTML এবং CSS পরিবর্তনগুলিকে সেভ করতে দেয়৷

এটি জাভাস্ক্রিপ্টের সাথে কীভাবে কাজ করে তা দেখুন:

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

মিথুনকে কর্মক্ষমতার অন্তর্দৃষ্টি সম্পর্কে জিজ্ঞাসা করুন

একটি বোতামে ক্লিক করে, আপনি এখন নিচের পারফরম্যান্সের অন্তর্দৃষ্টিগুলি তদন্ত করতে এবং কাজ করতে জেমিনীর সাথে একটি চ্যাট শুরু করতে পারেন:

  • পর্যায়ক্রমে LCP
  • LCP অনুরোধ আবিষ্কার
  • ব্লক করার অনুরোধ রেন্ডার করুন
  • লেআউট শিফট অপরাধীদের
  • নথি অনুরোধ বিলম্বিত

পারফরম্যান্স প্যানেলে একটি অন্তর্দৃষ্টিতে 'Ask AI' বোতাম যোগ করার আগে এবং পরে।

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

মিথুনের সাথে পারফরম্যান্সের ফলাফল টীকা করুন

আপনি এখন মিথুনকে পারফরম্যান্স ট্রেসে ইভেন্টগুলি সম্পর্কে টীকা তৈরি করতে বলতে পারেন৷

প্রধান ট্র্যাকের একটি ইভেন্টে ডাবল-ক্লিক করুন, তারপর ইনপুট ক্ষেত্রের পাশে লেবেল তৈরি করুন ক্লিক করুন। মিথুন স্ট্যাক ট্রেস এবং প্রসঙ্গের উপর ভিত্তি করে একটি লেবেল প্রস্তাব করতে পারে।

মিথুনের সাথে আপনার চ্যাটে স্ক্রিনশট যোগ করুন

AI সহায়তা প্যানেলে, আপনি এখন পৃষ্ঠার একটি স্ক্রিনশট ক্যাপচার করতে স্ক্রিনশট নিন বোতামে ক্লিক করতে পারেন এবং জেমিনীর সাথে আপনার চ্যাটে জমা দিতে পারেন।

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

'AI সহায়তা' প্যানেলে 'স্ক্রিনশট নিন' বোতাম যোগ করার আগে এবং পরে।

পারফরম্যান্স প্যানেলে নতুন অন্তর্দৃষ্টি

এই সংস্করণটি পারফরম্যান্স প্যানেলে দুটি নতুন অন্তর্দৃষ্টি নিয়ে আসে: ডুপ্লিকেট জাভাস্ক্রিপ্ট এবং লিগ্যাসি জাভাস্ক্রিপ্ট ।

সদৃশ জাভাস্ক্রিপ্ট

নতুন পারফরম্যান্স > অন্তর্দৃষ্টি > ডুপ্লিকেটেড জাভাস্ক্রিপ্ট নেটওয়ার্কে হাইলাইট করবে যদি আপনার পৃষ্ঠায় উপস্থিত থাকে তাহলে আপনার বান্ডিলে বড় ডুপ্লিকেট জাভাস্ক্রিপ্ট মডিউলের জন্য অনুরোধগুলিকে ট্র্যাক করবে।

পারফরম্যান্স প্যানেলে 'ডুপ্লিকেটেড জাভাস্ক্রিপ্ট' অন্তর্দৃষ্টি।

আপনি জাভাস্ক্রিপ্ট নির্ভরতা অন্বেষণ করতে অন্তর্দৃষ্টিতে ট্রিম্যাপ দেখুন ক্লিক করতে পারেন।

লিগ্যাসি জাভাস্ক্রিপ্ট

নতুন পারফরম্যান্স > অন্তর্দৃষ্টি > লিগ্যাসি জাভাস্ক্রিপ্ট নেটওয়ার্কে হাইলাইট করবে যদি লিগ্যাসি জাভাস্ক্রিপ্টের অনুরোধগুলি আপনার পৃষ্ঠায় উপস্থিত থাকে, উদাহরণস্বরূপ, পলিফিল এবং রূপান্তর যা পুরানো ব্রাউজারগুলিকে নতুন জাভাস্ক্রিপ্ট বৈশিষ্ট্যগুলি ব্যবহার করতে সক্ষম করে৷ যাইহোক, আধুনিক ব্রাউজারগুলির জন্য অনেকগুলি প্রয়োজনীয় নয়।

পারফরম্যান্স প্যানেলে 'লিগেসি জাভাস্ক্রিপ্ট' অন্তর্দৃষ্টি।

অনুমান এখন নিয়ম ট্যাগ সমর্থন করে

অ্যাপ্লিকেশান > অনুমানমূলক লোডগুলি এখন নিয়ম সেটের জন্য URL-এর পরিবর্তে ট্যাগ দেখায়, যদি ট্যাগগুলি উপস্থিত থাকে।

নিয়ম প্রতিস্থাপনের আগে এবং পরে একটি ট্যাগ দিয়ে ইউআরএল সেট করে।

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

বাতিঘর 12.6.0

Lighthouse প্যানেল এখন Lighthouse 12.6.0 চালায়।

সবচেয়ে উল্লেখযোগ্যভাবে এই সংস্করণে, Lighthouse পারফরম্যান্স অন্তর্দৃষ্টি নিরীক্ষণে চলে যাচ্ছে । লাইটহাউস রিপোর্টের পারফরম্যান্স বিভাগে, আপনি এখন অন্তর্দৃষ্টি চেষ্টা করতে পারেন।

লাইটহাউস রিপোর্টে অন্তর্দৃষ্টিতে স্যুইচ করার বিকল্প যোগ করার আগে এবং পরে।

পরিবর্তনের সম্পূর্ণ তালিকাও দেখুন।

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

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

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

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

  • নেটওয়ার্ক : সার্ভার সময়ের পরিচিত ফরম্যাটের জন্য পার্সিং যোগ করা হয়েছে।
  • আপনি এখন Cmd / Ctrl + ক্লিক (Chromium সমস্যা: 409474445 ) দিয়ে সারণির সারিগুলি অনির্বাচন করতে পারেন।
  • কর্মক্ষমতা > অন্তর্দৃষ্টি > দক্ষ ক্যাশে লাইফটাইম ব্যবহার করুন এখন TTL সমান বা 30 দিনের বেশি সম্পদের সাথে উপেক্ষা করে।

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

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

  • কর্মক্ষমতা : ট্রেসে ইনিশিয়েটর তীরগুলি এখন আরও দৃশ্যমান।
  • উপাদান : আপনি এখন শর্টকাট A (Chromium সমস্যা: 40888478 ) দিয়ে পূর্ণ-পৃষ্ঠা অ্যাক্সেসিবিলিটি ট্রি ভিউ টগল করতে পারেন।

  • স্ক্রীন রিডাররা এখন ঘোষণা করে, অন্যান্য জিনিসের মধ্যে:

    • আপনি কোড ব্লক থেকে অনুলিপি করার সময় "ক্লিপবোর্ডে অনুলিপি করা"।
    • আপনি যখন AI সহায়তা চ্যাটে আপনার কর্মক্ষেত্রে পরিবর্তনগুলি প্রয়োগ করেন তখন "ওয়ার্কস্পেসে আবেদন করা"৷
    • "লেবেল তৈরি করা" যখন আপনি AI কে এটিকে পারফরম্যান্স > টীকাতে তৈরি করতে বলবেন।
    • মনে রাখবেন যে AI সহায়তা চ্যাটে প্রস্তাবিত প্রম্পট রয়েছে।
    • পারফরম্যান্স > অন্তর্দৃষ্টিতে প্রাসঙ্গিক অন্তর্দৃষ্টির জন্য আনুমানিক সঞ্চয় পড়ুন।

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

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

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

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

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

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

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