DevTools (Chrome 121) में नया क्या है

नेटवर्क पैनल में बेहतर फ़िल्टर बार

फ़िल्टर बार को फिर से डिज़ाइन किया गया है, ताकि अनुरोधों को आसानी से फ़िल्टर किया जा सके और नेटवर्क पैनल को व्यवस्थित किया जा सके.

इस वर्शन में, उससे जुड़ा एक्सपेरिमेंट डिफ़ॉल्ट रूप से चालू था. हालांकि, इसे पहले जैसा कर दिया जाएगा. इसकी प्रोग्रेस को crbug.com/1523150 पर ट्रैक किया जा सकता है.

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

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

इस सुविधा के बारे में अपने सुझाव, शिकायत या राय देने के लिए, crbug.com/1500573 पर जाएं.

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

एलिमेंट में किए गए सुधार

@font-palette-values सहायता

एलिमेंट पैनल में अब @font-palette-values सीएसएस at-rule का इस्तेमाल किया जा सकता है. इसकी मदद से, font-palette प्रॉपर्टी की डिफ़ॉल्ट वैल्यू को पसंद के मुताबिक बनाया जा सकता है.

स्टाइल में, font-palette प्रॉपर्टी की वैल्यू पर क्लिक करें. ऐसा करने पर, DevTools आपको @font-palette-values सेक्शन पर ले जाएगा. यहां अपनी कस्टम वैल्यू में बदलाव किया जा सकता है.

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

काम करने वाला उदाहरण: किसी अन्य कस्टम प्रॉपर्टी के फ़ॉलबैक के तौर पर कस्टम प्रॉपर्टी

एलिमेंट > स्टाइल में अब ऐसी कस्टम प्रॉपर्टी को हल किया जाता है जो किसी दूसरी कस्टम प्रॉपर्टी का फ़ॉलबैक है.

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

सोर्स मैप के लिए बेहतर सहायता

सेटिंग सेटिंग > प्रयोग > check_box सोर्स मैप का इस्तेमाल करके, एक्सप्रेशन में वैरिएबल के नामों को हल करें डिफ़ॉल्ट रूप से चालू है.

DevTools, सोर्स मैप का इस्तेमाल करता है, ताकि आप सोर्स और स्कोप में अपने ओरिजनल कोड को डीबग कर सकें. भले ही, आपने उसे जोड़ दिया हो, छोटा कर दिया हो या कंपाइल कर दिया हो. इस एक्सपेरिमेंट की मदद से, DevTools में अपने ओरिजनल वैरिएबल के नामों का लगातार आकलन किया जा सकता है. इसमें ये चीज़ें शामिल हैं, लेकिन इन तक ही सीमित नहीं हैं:

• कंसोल में एक्सप्रेशन और ऑटोकंप्लीट की सुविधा से मिलने वाले सुझाव

  

• लाइव एक्सप्रेशन

  

• स्मार्टवॉच पर एक्सप्रेशन

  

• शर्त के हिसाब से ब्रेकपॉइंट और लॉगपॉइंट

  

ज़्यादा जानकारी के लिए, इससे जुड़ा आरएफ़सी देखें.

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

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

बेहतर इंटरैक्शन ट्रैक

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

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

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

बॉटम-अप, कॉल ट्री, और इवेंट लॉग टैब में बेहतर फ़िल्टर करने की सुविधा

परफ़ॉर्मेंस पैनल में मौजूद बॉटम-अप, कॉल ट्री, और इवेंट लॉग टैब में, बेहतर तरीके से फ़िल्टर करने के लिए तीन नए बटन जोड़े गए हैं:

• match_case केस मैच करें.
• regular_expression रेगुलर एक्सप्रेशन.
• match_word पूरे शब्द से मैच करें.

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

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

सोर्स पैनल में इंडेंटेशन मार्कर

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

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

नेटवर्क पैनल में, बदले गए हेडर और कॉन्टेंट के लिए काम के टूलटिप

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

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

अनुरोध को ब्लॉक करने के पैटर्न जोड़ने और हटाने के लिए, कमांड मेन्यू के नए विकल्प

अब कमांड मेन्यू में, नेटवर्क अनुरोध को ब्लॉक करने के पैटर्न जोड़ने या हटाने के लिए, कमांड टाइप किए जा सकते हैं.

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

सीएसपी उल्लंघन से जुड़ा एक्सपेरिमेंट हटा दिया गया है

वर्शन 89 में एक्सपेरिमेंट के तौर पर जोड़ा गया सीएसपी के उल्लंघन टैब, अब काम का नहीं है. इसलिए, इसे हटा दिया गया है.

सीएसपी की जानकारी एक नज़र में देखने के लिए, ऐप्लिकेशन > फ़्रेम > कॉन्टेंट की सुरक्षा के बारे में नीति (सीएसपी) पर जाएं.

इसके अलावा, समस्याएं पैनल, सीएसपी के उल्लंघनों की रिपोर्ट करता है.

Lighthouse 11.3.0

Lighthouse पैनल अब Lighthouse 11.3.0 पर काम करता है. बदलावों की पूरी सूची देखें. इसमें 404 पेजों पर रिपोर्ट चलाने की सुविधा भी शामिल है.

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

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

सुलभता

इस वर्शन में, सुलभता से जुड़े ये सुधार किए गए हैं:

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

Chromium से जुड़ी समस्याएं: 1338391, 1500662, 1420362.

अन्य हाइलाइट

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

• प्रदर्शन. अगर रिकॉर्डिंग पूरी नहीं हो पाती है, तो अब आपके पास रॉ ट्रेस इवेंट डाउनलोड करने का विकल्प है. साथ ही, यह पता लगाने की कोशिश करें कि क्या गड़बड़ी हुई (commit).
• कंसोल दिखाएं शॉर्टकट (Mac के लिए Ctrl+`, Windows और Linux के लिए Ctrl++) अब न सिर्फ़ कंसोल खोलता है, बल्कि दूसरी बार दबाने पर उसे बंद भी कर देता है.
• डेवलपर के लिए संसाधन. एक गड़बड़ी को ठीक किया गया, जिसकी वजह से सीएसएस रिसॉर्स और उनकी समस्याओं की शिकायत नहीं की जा सकती थी (1420362).
• एलिमेंट:
  • iframes में एलिमेंट की जांच करने से जुड़ी गड़बड़ी को ठीक किया गया (1453375).
  • आपके दिए गए फ़ॉर्मूला के आधार पर तैयार किए गए. एक गड़बड़ी को ठीक किया गया है, जिसकी वजह से डिफ़ॉल्ट वैल्यू रेंडर नहीं हो पा रही थीं (1499882).
  • सर्च. एक या दो वर्ण (1416457) वाली छोटी क्वेरी के लिए, मैच की संख्या का हिसाब लगाने से रोकने वाले बग को ठीक किया गया.
• कंसोल. अब फ़िल्टर बॉक्स (1346936) में, एस्केप किए गए वर्ण के साथ खत्म होने वाले रेगुलर एक्सप्रेशन को सही तरीके से पार्स किया जाता है.
• सेटिंग > Workspace. एक गड़बड़ी को ठीक किया गया है, जिसकी वजह से बाहर रखे गए फ़ोल्डर को जोड़ा नहीं जा सका (1503580).
• नेटवर्क > झलक. अब data: यूआरआई (1381791) वाली इमेज रेंडर करता है.
• मेमोरी. ऐक्शन बार में, अपलोड लोड और डाउनलोड सेव बटन जोड़े गए हैं (1275407).

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

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

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

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

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

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

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