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

Gemini की मदद से, नेटवर्क के अनुरोधों, सोर्स फ़ाइलों, और परफ़ॉर्मेंस ट्रेस को डीबग करना

सीएसएस स्टाइल के अलावा, अब नेटवर्क के अनुरोधों, सोर्स फ़ाइलों, और परफ़ॉर्मेंस ट्रेस के बारे में Gemini से चैट की जा सकती है.

एलिमेंट पैनल में मौजूद संदर्भ मेन्यू की तरह ही, एआई की मदद पैनल खोलने और Gemini के साथ चैट शुरू करने के लिए, दायां क्लिक करके एआई से पूछें चुनें या इनके बगल में मौजूद एआई से पूछें बटन पर क्लिक करें:

• नेटवर्क पैनल में नेटवर्क से जुड़ा अनुरोध.
• सोर्स > पेज टैब में मौजूद कोई फ़ाइल.
• परफ़ॉर्मेंस > मुख्य ट्रैक में मौजूद कोई गतिविधि.

Gemini, चुने गए अनुरोध, फ़ाइल या गतिविधि के कॉन्टेक्स्ट को ध्यान में रखेगा.

DevTools की टीम को crbug.com/364805393 पर आपका सुझाव, राय या शिकायत का इंतज़ार रहेगा.

एआई से की गई चैट का इतिहास

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

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

'ऐप्लिकेशन' > 'स्टोरेज' में जाकर, एक्सटेंशन का स्टोरेज मैनेज करना

लोकल और सेशन स्टोरेज की तरह ही, अब ऐप्लिकेशन > स्टोरेज सेक्शन में जाकर, एक्सटेंशन स्टोरेज की एंट्री देखी और बदली जा सकती हैं.

Chromium से जुड़ी समस्या: crbug.com/40963428.

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

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

लाइव मेट्रिक में इंटरैक्शन के फ़ेज़

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

Web Vitals एक्सटेंशन, अब DevTools में उपलब्ध है लेख में बताया गया है कि इन सुविधाओं के रिलीज़ होने के बाद, Web Vitals एक्सटेंशन के लिए सहायता उपलब्ध नहीं होगी.

Chromium से जुड़ी समस्या: crbug.com/369097528.

खास जानकारी वाले टैब में, रेंडर होने से रोकने से जुड़ी जानकारी

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

scheduler.postTask इवेंट और इन्हें शुरू करने वाले ऐरो के लिए सहायता

परफ़ॉर्मेंस > मुख्य ट्रैक में अब scheduler.postTask() इवेंट और इनके बीच, इवेंट शुरू करने वाले ऐरो दिखते हैं:

• Schedule postTask -> Fire postTask
• Schedule postTask -> Abort postTask

Chromium से जुड़ी समस्या: crbug.com/40775984.

ऐनिमेशन पैनल और एलिमेंट > स्टाइल टैब में सुधार

इस वर्शन में, ऐनिमेशन पैनल और एलिमेंट > स्टाइल टैब में कुछ सुधार किए गए हैं.

एलिमेंट > स्टाइल से ऐनिमेशन पर जाना

एलिमेंट > स्टाइल टैब में अब animation प्रॉपर्टी की वैल्यू के बगल में, ऐनिमेशन ऐनिमेशन पैनल पर जाएं बटन दिखते हैं. इससे, ऐनिमेशन में आसानी से बदलाव किया जा सकता है.

'कंप्यूट किया गया' टैब में रीयल-टाइम अपडेट

एलिमेंट > कंप्यूट की गई टैब, अब कैलकुलेट की गई वैल्यू को रीयल-टाइम में अपडेट करता है. उदाहरण के लिए, जब ऐनिमेशन उन्हें अपडेट करते हैं.

सेंसर में प्रेशर एम्युलेटर का इस्तेमाल करना

सेंसर पैनल की मदद से, अब Nominal, Fair, Serious, और Critical सीपीयू पर पड़ने वाले दबाव को एमुलेट किया जा सकता है.

Chromium से जुड़ी समस्या: crbug.com/362277525.

मेमोरी पैनल में, सोर्स के हिसाब से व्यवस्थित किए गए एक ही नाम वाले JS ऑब्जेक्ट

मेमोरी पैनल अब एक ही नाम वाले उन JS ऑब्जेक्ट के बीच अंतर करता है जो अलग-अलग सोर्स से आते हैं. साथ ही, उन्हें उनके हिसाब से ग्रुप करता है.

Chromium से जुड़ी समस्या: crbug.com/357902505.

सेटिंग का नया लुक

यूज़र इंटरफ़ेस के डिज़ाइन को बेहतर तरीके से अलाइन करने के लिए, DevTools की सेटिंग अब Chrome की सेटिंग से मिलती-जुलती हैं. खास तौर पर, सेक्शन अब विज़ुअल तौर पर "कार्ड" में अलग-अलग किए गए हैं.

परफ़ॉर्मेंस के बारे में अहम जानकारी देने वाले पैनल को बंद कर दिया गया है और DevTools से हटा दिया गया है

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

DevTools की टीम, इस पैनल के बंद होने और परफ़ॉर्मेंस की गड़बड़ी को डीबग करने के अनुभव के बारे में आपके दिए गए सुझाव, शिकायत या राय के लिए आपका धन्यवाद करती है. हमेशा की तरह, हमें आपके सुझाव, शिकायत या राय पाकर खुशी होगी. वीडियो बनाते रहें!

अन्य हाइलाइट

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

• परफ़ॉर्मेंस:
  • खोज क्वेरी के लिए, तीन वर्णों की ग़ैर-ज़रूरी सीमा हटा दी गई है.
  • होम होम बटन जोड़ा गया है. इसकी मदद से, लाइव मेट्रिक की स्क्रीन पर वापस जाया जा सकता है.
  • Shift+S/W ट्रैक ज़ूम करने के शॉर्टकट को ठीक किया गया, जो पहले काम नहीं कर रहे थे.
• एलिमेंट > स्टाइल:
  • ऑटोकंप्लीट 341991541 में anchor-center जोड़ा गया.
  • फ़्लेक्सबॉक्स एडिटर से जुड़ी एक गड़बड़ी को ठीक किया गया है. यह गड़बड़ी, दो शब्दों वाली वैल्यू 341964645 के लिए उपलब्ध नहीं थी.
• नेटवर्क: कॉन्टेंट को पहले से लोड करने में हुई गड़बड़ियों को अब लाल रंग की गड़बड़ियों के बजाय, पीले रंग की चेतावनियों के तौर पर दिखाया जाएगा. इससे यह पता चलता है कि कॉन्टेंट के डिसप्ले पर कोई असर नहीं पड़ा है 372055494.

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

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

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

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

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

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

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