DevTools डाइजेस्ट - टैब को फिर से क्रम में लगाना, '2 पर कंसोल', और फ़्रेमवर्क इवेंट लिसनर

पॉल बकॉस
पॉल बैकॉस

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

पैनल पर बेहतर नेविगेशन: #2 पर कंसोल, टैब को फिर से क्रम में लगाने की सुविधा, और शानदार अंडरलाइनें

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

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

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

फ़्रेमवर्क इवेंट लिसनर के लिए सहायता

DevTools के साथ काम करते समय, jQuery जैसे JS फ़्रेमवर्क के बनाए गए इवेंट को कभी-कभी मुश्किलों का सामना करना पड़ता है. इसकी वजह यह है कि ज़्यादातर फ़्रेमवर्क, नेटिव डीओएम इवेंट को अपने कस्टम इवेंट एपीआई में रैप कर देते हैं. इसलिए, इवेंट की पहचान करने वाले व्यक्ति को देखने से यह पता नहीं चलता कि क्या हो रहा है:

फ़्रेमवर्क लिसनर बंद है

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

फ़्रेमवर्क लिसनर चालू है

बाकियों को सबसे अच्छा लगा

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

    टाइमलाइन से जुड़ा संकेत.
  • इसी तरह, नेटवर्क पैनल अभी खाली होने पर मददगार संकेत दिखाता है:

    नेटवर्क से जुड़ी सलाह.
  • अब आपके पास नेटवर्क पैनल में मिले-जुले कॉन्टेंट को फ़िल्टर करने का विकल्प है. इसके लिए, फ़िल्टर इनपुट का इस्तेमाल करके उसे mixed-content:displayed पर सेट करें


हमेशा की तरह, Twitter के ज़रिए हमें अपनी राय दें या नीचे दी गई टिप्पणियां बात करें और crbug.com/new पर बग सबमिट करें.

अगले महीने तक! पॉल बैकॉस और DevTools टीम