Chrome 133 के DevTools में नया क्या है

एआई के साथ की गई चैट का इतिहास सेव रखने की सुविधा

एआई असिस्टेंस पैनल अब सभी सेशन में आपकी चैट का इतिहास सेव करता है. इसलिए, DevTools या Chrome को फिर से लोड करने के बाद भी, Gemini के साथ हुई पिछली बातचीत देखी जा सकती है.

परफ़ॉर्मेंस पैनल में सुधार

इस वर्शन में, परफ़ॉर्मेंस पैनल में कई सुधार किए गए हैं.

इमेज डिलीवरी की अहम जानकारी

परफ़ॉर्मेंस > अहम जानकारी टैब में अब उन इमेज को हाइलाइट किया जा सकता है जिनके फ़ाइल साइज़ को ऑप्टिमाइज़ किया जा सकता है. नेटवर्क ट्रैक में हाइलाइट की गई इमेज देखने के लिए, अहम जानकारी में मौजूद किसी इमेज पर क्लिक करें.

इमेज डिलीवरी को ऑप्टिमाइज़ करने के तरीके के बारे में ज़्यादा जानने के लिए, इमेज को बेहतर ढंग से कोड में बदलना लेख पढ़ें.

कीबोर्ड नेविगेशन की क्लासिक और मॉडर्न सुविधा

परफ़ॉर्मेंस पैनल में अब कीबोर्ड नेविगेशन की अपनी पसंद की स्टाइल चुनी जा सकती है. इन दोनों स्टाइल में ये मुख्य अंतर हैं:

• क्लासिक: माउस के पहिए (टचपैड को ऊपर या नीचे) से ज़ूम करें. साथ ही, Shift + माउस के पहिए से वर्टिकल स्क्रोल करें.
• मॉडर्न: माउस व्हील से वर्टिकल स्क्रोल करें, Shift + माउस व्हील से हॉरिज़ॉन्टल स्क्रोल करें, और Command/Control + माउस व्हील से ज़ूम करें.

अपनी पसंद की स्टाइल चुनने के लिए, पैनल के सबसे ऊपर दाएं कोने में मौजूद, सहायता शॉर्टकट दिखाएं पर क्लिक करें. इसके बाद, क्लासिक या मॉर्डन चुनें. शॉर्टकट वाले डायलॉग बॉक्स में, आपको उपलब्ध शॉर्टकट की चीटशीट भी मिलती है.

फ़्लेम चार्ट में काम की नहीं लगने वाली स्क्रिप्ट को अनदेखा करें

अपने कोड पर बेहतर तरीके से फ़ोकस करने के लिए, अब परफ़ॉर्मेंस पैनल में जाकर, काम की नहीं लगने वाली स्क्रिप्ट को अनदेखा की जाने वाली सूची में जोड़ा जा सकता है. पैनल में, बहुत ज़्यादा नेस्टिंग होने पर, वह अपने-आप छोटा हो जाएगा.

नज़रअंदाज़ किए जाने वाले कोड की सूची में स्क्रिप्ट जोड़ने के लिए, सबसे ऊपर मौजूद ऐक्शन बार में कंप्रेस करें नज़रअंदाज़ किए जाने वाले कोड की सूची की सेटिंग का डायलॉग बॉक्स दिखाएं पर क्लिक करें. इसके बाद, इनपुट फ़ील्ड में कोई रेगुलर एक्सप्रेशन टाइप करें. टाइप करते समय, फ़्लेम चार्ट में नया नियम लागू हो जाएगा.

DevTools, सेटिंग सेटिंग > अनदेखी की गई सूची में जोड़े गए अनदेखी की गई सूची के नियमों को सेव करता है. साथ ही, आपके पास उन्हें अपनी ज़रूरत के हिसाब से चालू और बंद करने का विकल्प होता है.

कर्सर घुमाने पर टाइमलाइन मार्कर और रेंज हाइलाइट करना

परफ़ॉर्मेंस ट्रेस को बेहतर तरीके से समझने में आपकी मदद करने के लिए, परफ़ॉर्मेंस पैनल अब ये काम करता है:

• टाइमलाइन पर कर्सर घुमाने पर, आपको एक वर्टिकल मार्कर दिखेगा. यह मार्कर, परफ़ॉर्मेंस ट्रेस के पूरे हिस्से में फैला होता है.
• मुख्य ट्रैक में मौजूद आइटम पर कर्सर घुमाने पर, टाइमलाइन में मौजूद किसी रेंज को हाइलाइट करता है.

थ्रॉटलिंग की सुझाई गई सेटिंग

परफ़ॉर्मेंस पैनल अब लाइव मेट्रिक और सेटिंग से जुड़े कैप्चर सेटिंग ड्रॉप-डाउन मेन्यू, दोनों में थ्रॉटलिंग सेटिंग का सुझाव देता है.

फ़िलहाल, सीपीयू थ्रॉटलिंग के लिए सुझाया गया विकल्प, सबसे ज़्यादा इस्तेमाल किया जाने वाला 4x slowdown है. साथ ही, नेटवर्क के लिए सुझाया गया विकल्प, Chrome UX रिपोर्ट के डेटा पर आधारित होता है. ऐसा तब होता है, जब लाइव मेट्रिक में यह विकल्प चालू हो.

इसके अलावा, परफ़ॉर्मेंस पैनल अब आपको थ्रॉटलिंग की उन सेटिंग के बारे में याद दिलाता है जिनका इस्तेमाल आपने ऐक्शन बार में हाल के सेशन ड्रॉप-डाउन मेन्यू में हर ट्रेस के बगल में किया था.

ओवरले में टाइमिंग मार्कर

टाइमिंग मार्कर को टाइमिंग ट्रैक से हटाकर, ट्रेस के सबसे नीचे ले जाया गया है. अब ये सभी ट्रैक के ऊपर दिखते हैं. साथ ही, अगर टाइमिंग ट्रैक छिपा हुआ है, तब भी ये दिखते हैं.

Timings ट्रैक, आपके कस्टम mark() और measure() कॉल को बनाए रखता है.

खास जानकारी में JavaScript कॉल के स्टैक ट्रेस

परफ़ॉर्मेंस > खास जानकारी टैब में अब आपको JavaScript कॉल के स्टैक ट्रेस दिखेंगे. इनमें एसिंक कॉल भी शामिल हैं.

बैज की सेटिंग को Elements के मेन्यू में ले जाया गया

तत्व पैनल में बैज की सेटिंग को, डिफ़ॉल्ट रूप से छिपे हुए ऐक्शन बार से हटाकर, उससे जुड़े राइट-क्लिक मेन्यू में ले जाया गया है.

'नया क्या है' पैनल

नया क्या है पैनल को नया लुक दिया गया है. यह Chrome के डिज़ाइन से ज़्यादा मिलता-जुलता है.

Chromium से जुड़ी समस्या: 325441858.

Lighthouse 12.3.0

Lighthouse पैनल अब Lighthouse 12.3.0 पर काम करता है.

इस अपडेट में, अन्य चीज़ों के साथ-साथ नई ऑडिट भी जोड़ी गई हैं. ये ऑडिट, COOP की मदद से ऑरिजिन को पूरी तरह आइसोलेट करने और मज़बूत एचएसटीएस नीति की जांच करती हैं. बदलावों की पूरी सूची देखें.

DevTools में Lighthouse पैनल इस्तेमाल करने के बारे में बुनियादी बातें जानने के लिए, Lighthouse: वेबसाइट की स्पीड ऑप्टिमाइज़ करना लेख पढ़ें.

Chromium से जुड़ी समस्या: 40543651.

अन्य हाइलाइट

इस रिलीज़ में, कुछ अहम गड़बड़ियां ठीक की गई हैं और सुधार किए गए हैं:

• सोर्स: अब रोकने पर, डिबगर, सर्विस वर्कर के कॉन्टेक्स्ट पर अचानक से स्विच नहीं होता है. ऐसा तब होता है, जब इसे रोकने के बाद बनाया जाता है (373893057).
• परफ़ॉर्मेंस:
  • स्क्रिप्ट पर कर्सर घुमाने पर, फ़्लेम चार्ट में मौजूद टूलटिप अब यूआरएल दिखाती हैं. अगर कोई यूआरएल मौजूद है, तो वह भी दिखेगा (368541957).
  • खास जानकारी: पाई चार्ट को बार के तौर पर दिखाया गया है.
  • कैप्चर सेटिंग में मौजूद एक्सटेंशन डेटा चेकबॉक्स का नाम बदलकर कस्टम ट्रैक दिखाएं कर दिया गया है.
  • अहम जानकारी टैब में अब ज़रूरी शर्तें पूरी करने वाली अहम जानकारी (N) सेक्शन है. यह डिफ़ॉल्ट रूप से छोटा किया गया है.
• ऐप्लिकेशन > स्टोरेज: खाली कुंजियों के साथ स्टोरेज एंट्री बनाई जा सकती हैं, क्योंकि वे तकनीकी तौर पर मान्य होती हैं (373703285).
• chrome:// पेजों (40186276) के लिए, डिवाइस मोड अब बंद है.
• नेटवर्क:
  • सेटिंग चालू होने पर, HAR फ़ाइल एक्सपोर्ट करें पर एक बार क्लिक करने से, अब दो विकल्पों वाला मेन्यू खुलता है. इसमें, संवेदनशील जानकारी शामिल किए बिना और संवेदनशील जानकारी के साथ एक्सपोर्ट करने का विकल्प होता है. इससे पहले, मेन्यू को देर तक क्लिक करके खोला जाता था (378076279).
  • cURL के तौर पर कॉपी करें अब कुकी को बायपास करने और ज़्यादा आसानी से पढ़ने के लिए, -b एट्रिब्यूट का इस्तेमाल करता है. यह -H 'cookie:...' (40791742) के बजाय इस्तेमाल किया जाता है.
• सुलभता: अब कॉन्टेक्स्ट मेन्यू (383164782) की मदद से, टैब को पैनल में बाईं या दाईं ओर ले जाया जा सकता है.
• नेटवर्क के अनुरोध को ब्लॉक करने वाला टूल: इस कमांड मेन्यू की सेटिंग अब इससे जुड़े चेकबॉक्स (378058733) के साथ सिंक हो गई है.

झलक दिखाने वाले चैनल डाउनलोड करना

Chrome Canary, Dev या Beta को डिफ़ॉल्ट डेवलपमेंट ब्राउज़र के तौर पर इस्तेमाल करें. इन प्रीव्यू चैनलों से, आपको DevTools की नई सुविधाओं का ऐक्सेस मिलता है. साथ ही, आपको वेब प्लैटफ़ॉर्म के नए एपीआई को आज़माने का मौका मिलता है. इसके अलावा, आपको अपनी साइट पर मौजूद समस्याओं का पता लगाने में मदद मिलती है. इससे पहले कि आपके उपयोगकर्ता उन समस्याओं का पता लगाएं!

Chrome DevTools टीम से संपर्क करना

नई सुविधाओं, अपडेट या DevTools से जुड़ी किसी अन्य चीज़ के बारे में चर्चा करने के लिए, इन विकल्पों का इस्तेमाल करें.

• हमें सुझाव/राय देने या शिकायत करने के लिए, crbug.com पर जाएं. साथ ही, किसी सुविधा का अनुरोध करने के लिए भी इसी लिंक पर जाएं.
• DevTools में, more_vert ज़्यादा विकल्प > सहायता > DevTools से जुड़ी समस्या की शिकायत करें का इस्तेमाल करके, DevTools से जुड़ी किसी समस्या की शिकायत करें.
• @ChromeDevTools पर ट्वीट करें.
• DevTools के YouTube वीडियो में नया क्या है या DevTools के बारे में सलाह देने वाले YouTube वीडियो पर टिप्पणी करें.

DevTools में नया क्या है

DevTools में नया क्या है सीरीज़ में शामिल किए गए सभी विषयों की सूची.