नेटवर्क पैनल: नेटवर्क लोड और संसाधनों का विश्लेषण करें

Dale St. Marthe

पेज लोड होने का विश्लेषण करने और नेटवर्क संसाधनों की जांच करने के लिए, नेटवर्क पैनल का इस्तेमाल करें.

खास जानकारी

नेटवर्क पैनल की मदद से:

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

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

नेटवर्क पैनल खोलना

नेटवर्क पैनल खोलने के लिए, DevTools खोलें. इसके बाद, सबसे ऊपर मौजूद ऐक्शन बार में मौजूद नेटवर्क पर क्लिक करें.

इसके अलावा, कमांड मेन्यू से नेटवर्क पैनल खोलने के लिए, यह तरीका अपनाएं:

1. DevTools खोलें.
2. कमांड मेन्यू खोलने के लिए, यह दबाएं:
3. macOS: Command+Shift+P
4. Windows, Linux, ChromeOS: Control+Shift+P
5. Network टाइप करना शुरू करें. इसके बाद, नेटवर्क पैनल दिखाएं को चुनें और Enter दबाएं.

नेटवर्क पर की गई गतिविधि रिकॉर्ड करना

DevTools खोलने पर, नेटवर्क अनुरोध नेटवर्क पैनल में अपने-आप रिकॉर्ड हो जाते हैं. ऐसा तब तक होता है, जब तक DevTools खुला रहता है.

रिकॉर्डिंग के अलावा, ये काम भी किए जा सकते हैं:

• नेटवर्क के अनुरोध रिकॉर्ड करना बंद करें.
• अनुरोध टेबल से, सभी अनुरोध मिटाएं.
• पेज लोड होने पर अनुरोधों को सेव करना.
• ऑफ़लाइन अनुभव को एमुलेट करना.
• धीमे नेटवर्क कनेक्शन को सिम्युलेट करना.

नेटवर्क अनुरोधों की जांच करना

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

डिफ़ॉल्ट रूप से दिखने वाले कॉलम और जोड़े जा सकने वाले अन्य कॉलम के बारे में ज़्यादा जानने के लिए, अनुरोधों का लॉग देखें लेख पढ़ें.

अनुरोध के बारे में ज़्यादा जानकारी वाले टैब देखने के लिए, अनुरोध के नाम पर क्लिक करें. इनमें ये चीज़ें शामिल हैं:

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

नेटवर्क से जुड़े अनुरोधों को फ़िल्टर करना और क्रम से लगाना

नेटवर्क पैनल की मदद से, अनुरोध टेबल में अनुरोधों को दो तरीकों से क्रम में लगाया जा सकता है:

• कॉलम के हिसाब से क्रम में लगाना
• गतिविधि के चरण के हिसाब से क्रम में लगाएं.

अनुरोध टेबल में अनुरोधों को फ़िल्टर करने के कई तरीके यहां दिए गए हैं:

• अनुरोधों को प्रॉपर्टी के हिसाब से फ़िल्टर करना
• अनुरोधों को उनके टाइप के हिसाब से फ़िल्टर करना
• समय के हिसाब से अनुरोध फ़िल्टर करना
• डेटा यूआरएल छिपाना
• एक्सटेंशन के यूआरएल छिपाना
• सिर्फ़ ब्लॉक की गई रिस्पॉन्स कुकी वाले अनुरोध दिखाएं
• सिर्फ़ ब्लॉक किए गए अनुरोध दिखाना
• सिर्फ़ तीसरे पक्ष के अनुरोध दिखाना

Search Network के हेडर और रिस्पॉन्स

किसी खास स्ट्रिंग या रेगुलर एक्सप्रेशन के लिए, सभी रिसॉर्स के एचटीटीपी हेडर और रिस्पॉन्स खोजने का तरीका जानने के लिए, Search Network के हेडर और रिस्पॉन्स देखें.

लोड होने का तरीका बदलना

नेटवर्क पैनल में जाकर, पेज लोड होने के तरीके में बदलाव करके, अपने पेज के उपयोगकर्ता अनुभव की जांच करें.

नेटवर्क पैनल का इस्तेमाल करके, ये काम किए जा सकते हैं:

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

नेटवर्क अनुरोध का डेटा सेव और एक्सपोर्ट करना

नेटवर्क अनुरोध का डेटा सेव और एक्सपोर्ट करने के लिए, यह लेख पढ़ें:

• सभी नेटवर्क अनुरोधों को HAR फ़ाइल में सेव करना
• एक या उससे ज़्यादा अनुरोधों को क्लिपबोर्ड पर कॉपी करना