अपनी साइट के लोड और रनटाइम की परफ़ॉर्मेंस के बारे में तुरंत जानने के लिए, परफ़ॉर्मेंस मॉनिटर का इस्तेमाल करें.
खास जानकारी
परफ़ॉर्मेंस मॉनिटर पैनल में एक टाइमलाइन दिखती है. इसमें परफ़ॉर्मेंस मेट्रिक को रीयल-टाइम में ग्राफ़ के तौर पर दिखाया जाता है. किसी मेट्रिक को दिखाने या छिपाने के लिए, उस पर क्लिक करें. इसके बाद, देखें कि आपके ऐप्लिकेशन के साथ इंटरैक्ट करने पर, ग्राफ़ कैसे बदलता है.
परफ़ॉर्मेंस मॉनिटर, इन मेट्रिक को ट्रैक करता है:
- सीपीयू का इस्तेमाल.
- JavaScript हीप का साइज़.
- पेज पर मौजूद डीओएम नोड, JavaScript इवेंट लिसनर, दस्तावेज़, और फ़्रेम की कुल संख्या.
- हर सेकंड में लेआउट और स्टाइल को फिर से कैलकुलेट करने की संख्या.
परफ़ॉर्मेंस मॉनिटर पैनल खोलना
परफ़ॉर्मेंस मॉनिटर पैनल खोलने के लिए:
- DevTools खोलें.
- कमांड मेन्यू खोलने के लिए, यह दबाएं:
- macOS: Command+Shift+P
- Windows, Linux, ChromeOS: Control+Shift+P
Performance monitorटाइप करना शुरू करें. इसके बाद, परफ़ॉर्मेंस मॉनिटर दिखाएं को चुनें और Enter दबाएं. DevTools, आपकी DevTools विंडो में सबसे नीचे परफ़ॉर्मेंस मॉनिटर पैनल दिखाता है.
इसके अलावा, सबसे ऊपर दाएं कोने में, ज़्यादा विकल्प > ज़्यादा टूल > परफ़ॉर्मेंस मॉनिटर को चुनें.
परफ़ॉर्मेंस मॉनिटर पैनल का इस्तेमाल करना
परफ़ॉर्मेंस मॉनिटर से, आपकी वेबसाइट की रनटाइम परफ़ॉर्मेंस के बारे में सामान्य जानकारी मिलती है.
वेबसाइट से इंटरैक्ट करने पर मेट्रिक की वैल्यू में होने वाले बदलावों को देखकर, परफ़ॉर्मेंस को बेहतर बनाने के अवसरों का पता लगाया जा सकता है.
परफ़ॉर्मेंस मॉनिटर की एक मददगार सुविधा यह है कि यह पेज नेविगेशन के दौरान भी काम करती रहती है. इसलिए, फ़्रंटएंड डेवलपर के तौर पर, परफ़ॉर्मेंस मॉनिटर खोलकर, अपनी वेबसाइट को स्क्रोल करके, और DOM नोड और लेआउट/सेकंड मेट्रिक पर नज़र रखकर, लेआउट थ्रैशिंग जैसी समस्याओं से बचा जा सकता है.
अगर उपयोगकर्ता आपकी साइट पर कॉन्टेंट लोड होने में लगने वाले समय की शिकायत कर रहे हैं, तो परफ़ॉर्मेंस मॉनिटर की मदद से, समस्या वाले हिस्सों की पहचान की जा सकती है.
उदाहरण के लिए, सीपीयू के इस्तेमाल में काफ़ी बढ़ोतरी होने से, यह पता चल सकता है कि कोड सही तरीके से काम नहीं कर रहा है. आम तौर पर, अगर किसी पेज में JS इवेंट के लिसनर की संख्या ज़्यादा है, तो अपने कोड को फिर से तैयार करें और मेमोरी खाली करने के लिए उन संख्याओं को कम करें.
अगर आपने अभी-अभी परफ़ॉर्मेंस का विश्लेषण करना शुरू किया है, तो हमारा सुझाव है कि आप सबसे पहले Lighthouse पैनल का इस्तेमाल करें. इसके बाद, परफ़ॉर्मेंस पैनल या परफ़ॉर्मेंस मॉनिटर का इस्तेमाल करके, ज़्यादा जांच करें.