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

Sofia Emelianova
Sofia Emelianova

ऑटोमैटिक भरने की सुविधा वाला नया पैनल

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

टेस्ट डेटा के साथ, इस डेमो पेज पर नए पैनल को आज़माएं:

  1. प्रोफ़ाइल में जानकारी अपने-आप भरना में जाकर, फ़ॉर्म भरें ... बटन में से किसी एक पर क्लिक करें. इसके बाद, सबमिट करें पर क्लिक करें. इसके बाद, पता सेव करें? डायलॉग विंडो में, सेव करें पर क्लिक करें और फ़ॉर्म वाले पेज पर वापस जाएं.
  2. DevTools खोलें और ऑटोमैटिक भरने की सुविधा वाला इवेंट ट्रिगर करें: कोई फ़ॉर्म फ़ील्ड चुनें और ड्रॉप-डाउन सूची से पता चुनें.

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

ऑटोमैटिक भरने की सुविधा वाला पैनल.

ज़्यादा जानने के लिए, फ़ॉर्म के बारे में जानें और ऑटोमैटिक भरने की सुविधा लेख पढ़ें.

WebRTC के लिए बेहतर नेटवर्क थ्रॉटलिंग

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

नए पैरामीटर ये हैं: पैकेट लॉस (प्रतिशत), पैकेट कतार की लंबाई (पैकेट की संख्या), और पैकेट का क्रम बदलना फ़्लैग.

कस्टम थ्रॉटलिंग प्रोफ़ाइलों में पैकेट से जुड़े नए विकल्प जोड़ने से पहले और बाद की इमेज.

WebRTC कनेक्शन को कम करने के लिए, सेटिंग > कम करना में जाकर, कस्टम प्रोफ़ाइल में पैकेट से जुड़े पैरामीटर तय करें. इसके बाद, नेटवर्क पैनल में जाकर, उसे चुनें.

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

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

ऐनिमेशन पैनल में स्क्रोल से चलने वाले ऐनिमेशन की सुविधा

ऐनिमेशन पैनल की मदद से, अब स्क्रोल से चलने वाले ऐनिमेशन की जांच की जा सकती है.

इस डेमो पेज पर जाकर, इस सुविधा को आज़माएं. स्क्रोल से चलने वाले ऐनिमेशन कैप्चर करने के लिए, ऐनिमेशन पैनल खोलें और पेज को फिर से लोड करें.

स्क्रोल-ड्रिवन ऐनिमेशन का ग्रुप, जिसे माउस आइकॉन से मार्क किया गया है.

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

एलिमेंट > स्टाइल में, सीएसएस नेस्टिंग की बेहतर सुविधा

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

इंडेंटेशन जोड़ने और नेस्ट किए गए स्टाइल को ब्रैकेट में रखने से पहले और बाद की इमेज.

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

बेहतर परफ़ॉर्मेंस पैनल

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

फ़्लेम चार्ट में फ़ंक्शन और उनके चाइल्ड को छिपाना

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

फ़ंक्शन और उनके चाइल्ड को छिपाने की सुविधा देने वाले कॉन्टेक्स्ट मेन्यू को जोड़ने से पहले और बाद की इमेज.

जिन फ़ंक्शन के चाइल्ड फ़ंक्शन छिपे हुए हैं उनकी दाईं ओर, ड्रॉप-डाउन बटन होता है. छिपाए गए बच्चों की संख्या देखने के लिए, उस पर कर्सर घुमाएं. उन्हें फिर से दिखाने के लिए, उस पर क्लिक करें. फ़्लेम चार्ट को उसकी शुरुआती स्थिति पर वापस लाने के लिए, किसी फ़ंक्शन पर राइट क्लिक करें और ट्रेस रीसेट करें चुनें.

चुने गए आइनिशियटर से उन इवेंट तक ऐरो

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

चुनी गई से शुरू की गई इवेंट और नाम वाले लिंक के बीच, ऐरो दिखाने से पहले और बाद की इमेज. इसमें 'दिखाएं' के बजाय, 'पहले और बाद की इमेज' का इस्तेमाल किया गया है.

इसके अलावा, अब सभी इनिशिएटर के पास खास जानकारी टैब में इनिशिएटर फ़ील्ड हैं. साथ ही, इनिशिएटर और इनिशिएट किया गया, दोनों फ़ील्ड में प्रकट करें के बजाय नाम वाले लिंक हैं.

Chromium से जुड़ी समस्याएं: 325604258, 325024819, 326055289.

Lighthouse 11.6.0

Lighthouse पैनल अब Lighthouse 11.6.0 पर काम करता है. बदलावों की पूरी सूची देखें.

इनमें, ऑप्ट-इन करने के लिए नई JS सैंपलिंग की सुविधा चालू करें सेटिंग शामिल है. यह सेटिंग डिफ़ॉल्ट रूप से बंद रहती है.

ऑप्ट-इन वाली JS सैंपलिंग सेटिंग जोड़ने से पहले और बाद में.

JS सैंपलिंग की सुविधा चालू करने पर, परफ़ॉर्मेंस ट्रेस में ज़्यादा जानकारी वाले JavaScript कॉल स्टैक जुड़ जाते हैं. हालांकि, इससे रिपोर्ट जनरेट होने में ज़्यादा समय लग सकता है.

JS सैंपलिंग के बिना (बाईं ओर) और उसके साथ (दाईं ओर) परफ़ॉर्मेंस ट्रेस.

Lighthouse रिपोर्ट जनरेट होने के बाद, यह ट्रेस टूल मेन्यू > बिना थ्रॉटल किए गए ट्रेस देखें में उपलब्ध होता है.

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

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

मेमोरी > ढेर के स्नैपशॉट में खास कैटगरी के लिए टूलटिप

मेमोरी पैनल में मौजूद हीप स्नैपशॉट में, ऑब्जेक्ट के खास ग्रुप होते हैं. ये ग्रुप, कन्स्ट्रक्टर पर आधारित नहीं होते. ऐसे ऑब्जेक्ट पर कर्सर घुमाने पर, यादें पैनल में आपको एक टूलटिप दिखेगा. इसमें, कम शब्दों में जानकारी के साथ-साथ दस्तावेज़ में दी गई ज़्यादा जानकारी का लिंक भी होगा.

ऑब्जेक्ट के खास ग्रुप के लिए, जानकारी देने वाला टूलटिप दिखाने से पहले और बाद की इमेज.

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

ऐप्लिकेशन > स्टोरेज के अपडेट

इस वर्शन में, ऐप्लिकेशन > स्टोरेज में कुछ अपडेट किए गए हैं.

शेयर किए गए स्टोरेज के लिए इस्तेमाल किए गए बाइट

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

शेयर किए गए स्टोरेज के लिए इस्तेमाल किए गए बाइट की संख्या दिखाने वाली इमेज.

शेयर किए गए स्टोरेज की मदद से, आपको अनलिमिटेड स्टोरेज का ऐक्सेस मिलता है. साथ ही, किसी भी साइट के स्टोरेज में, निजता बनाए रखते हुए, डेटा पढ़ने का ऐक्सेस भी मिलता है.

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

Web SQL अब काम नहीं करता

Chrome के 119 वर्शन में, WebSQL की सुविधा बंद कर दी गई है. साथ ही, इस वर्शन में, बंद होने से पहले आज़माने के लिए उपलब्ध टोकन को भी हटा दिया गया है. इसलिए, अब WebSQL का इस्तेमाल नहीं किया जा सकता.

इसी तरह, DevTools ने ऐप्लिकेशन पैनल से Web SQL सेक्शन को हटा दिया है.

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

कवरेज पैनल में सुधार

इस वर्शन में, कवरेज पैनल में कुछ अपडेट किए गए हैं:

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

बच्चों के मैच होने वाले आंकड़ों का सही तरीके से हिसाब लगाने से पहले और बाद की इमेज.

  • इस्तेमाल किए गए कोड का रंग अब हरे के बजाय स्लेटी हो गया है, ताकि इसे बेहतर तरीके से देखा जा सके. ऐसा खास तौर पर, उन लोगों के लिए किया गया है जिन्हें रंगों की पहचान करने में समस्या होती है.

इस्तेमाल किए गए कोड का रंग स्लेटी करने से पहले और बाद की इमेज.

Chromium से जुड़ी समस्या: 41494198, 329253687.

लेयर पैनल के इस्तेमाल पर रोक लगाई जा सकती है

कम इस्तेमाल होने की वजह से, लेयर पैनल के इस्तेमाल पर जल्द ही रोक लगा दी जाएगी. पैनल में अब सबसे ऊपर चेतावनी वाला बैनर दिखता है.

लेयर पैनल में सबसे ऊपर, चेतावनी वाला बैनर, जिसमें यह बताया गया है कि इस सुविधा का इस्तेमाल बंद किया जा सकता है.

पैनल को बंद करने का फ़ैसला लेने से पहले, अपनी राय और समस्याएं शेयर करें.

JavaScript प्रोफ़ाइलर बंद होने की प्रक्रिया: चौथा चरण, आखिरी चरण

इस वर्शन में, JS प्रोफ़ाइलर पैनल को पूरी तरह बंद कर दिया गया है और इसे फिर से चालू नहीं किया जा सकता.

सीपीयू की परफ़ॉर्मेंस की प्रोफ़ाइल बनाने के लिए, परफ़ॉर्मेंस पैनल का इस्तेमाल करें.

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

अन्य हाइलाइट

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

  • नेटवर्क:
    • एक से ज़्यादा लाइन वाली कुकी को गलत तरीके से पार्स करने से जुड़ी गड़बड़ी को ठीक किया गया (325410304).
    • इनिशियेटर कॉलम (327665602) में, कॉल स्टैक की झलक ठीक की गई.
  • परफ़ॉर्मेंस मॉनिटर: ट्रैक चेकबॉक्स अब बाकी यूज़र इंटरफ़ेस (यूआई) की तरह ही दिखते हैं (1467464).
  • सोर्स: XHTML दस्तावेज़ों के लिए सिंटैक्स हाइलाइट करने की सुविधा जोड़ी गई (327940244).
  • सेटिंग > डिवाइस: पुराने Galaxy Fold को नए Galaxy Z Fold 5 (40113439) से बदल दिया गया है.
  • परफ़ॉर्मेंस: Ctrl/Cmd+F (1523279) का इस्तेमाल करके खोजने पर, खोज के नतीजों में मैच होने वाले सभी शब्द हाइलाइट हो जाते हैं.
  • डेवलपर के लिए संसाधन: अब भाषा के एक्सटेंशन से लोड किए गए संसाधन भी दिखते हैं. जैसे, C/C++ DevTools Support (DWARF) Chrome एक्सटेंशन (40746829).
  • परफ़ॉर्मेंस: खास जानकारी टैब में, काटे गए कॉल स्टैक और उसके खराब लेआउट को ठीक किया गया (325314708).
  • ड্রॉअर: बंद करें बटन पर अब फ़ोकस किया जा सकता है. इसलिए, कीबोर्ड का इस्तेमाल करके पैनल बंद किए जा सकते हैं.

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

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

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

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

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

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