Lighthouse का इस्तेमाल करके, परफ़ॉर्मेंस से जुड़े अवसर खोजें

Kayce Basques

Lighthouse एक ऐसा टूल है जिसकी मदद से, किसी पेज की परफ़ॉर्मेंस को मेज़र किया जा सकता है. साथ ही, उसे बेहतर बनाने के तरीके भी ढूंढे जा सकते हैं. Lighthouse का इस्तेमाल करने का सामान्य वर्कफ़्लो यहां बताया गया है:

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

आपका मकसद, समय के साथ अपनी मेट्रिक के स्कोर को बेहतर बनाना है या कम से कम यह पक्का करना है कि वे खराब न हों. हालांकि, सीधे तौर पर मेट्रिक पर काम करने का कोई तरीका नहीं है. इसके बजाय, आपको Lighthouse से मिलने वाले अवसरों का फ़ायदा लेना होगा. उन अवसरों पर काम करने से, आपकी मेट्रिक के स्कोर बेहतर होते हैं.

अपने प्रोफ़ाइल पेज से Lighthouse चलाना

अपनी web.dev प्रोफ़ाइल के पेज से Lighthouse चलाने के लिए:

1. कोई भी यूआरएल दें. इसके बाद, लाइटहाउस कई ऑडिट चलाता है और पेज की परफ़ॉर्मेंस की रिपोर्ट जनरेट करता है.

2. ऑडिट रिपोर्ट की समीक्षा करके, उन जगहों की पहचान करें जहां आपके पेज को बेहतर बनाया जा सकता है.

3. हर ऑडिट के लिए, आपको दिशा-निर्देश और तुरंत उठाए जा सकने वाले कदमों की जानकारी मिलेगी. इनसे आपको अपने स्कोर को बेहतर बनाने में मदद मिलेगी.

Chrome DevTools से Lighthouse चलाना

Chrome DevTools, वेब डेवलपर टूल का एक सेट है, जो सीधे Google Chrome ब्राउज़र में बनाया गया है. DevTools का इस्तेमाल करने के लिए, आपको कुछ भी डाउनलोड करने की ज़रूरत नहीं है. अगर आपके पास Chrome है, तो आपके पास DevTools भी है.

1. Chrome में, उस पेज पर जाएं जिसका ऑडिट करना है.
2. DevTools खोलने के लिए, `Control+Shift+J` दबाएं. Mac पर, `Command+Option+J` दबाएं.

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

1. पक्का करें कि मोबाइल रेडियो बटन चुना गया हो. जब Lighthouse आपके पेज का ऑडिट करेगा, तो वह मोबाइल डिवाइस के व्यूपोर्ट और उपयोगकर्ता एजेंट स्ट्रिंग को सिम्युलेट करेगा.
2. पक्का करें कि परफ़ॉर्मेंस चेकबॉक्स चालू हो. ऑडिट सेक्शन में जाकर, बाकी चेकबॉक्स चालू या बंद किए जा सकते हैं. इन्हें चालू करने पर, आपको अपने पेज के अन्य पहलुओं को बेहतर बनाने के कई तरीके दिखेंगे.
3. पक्का करें कि सिम्युलेट किया गया फ़ास्ट 3G, सीपीयू की प्रोसेसिंग चार गुना धीमी रेडियो बटन चुना गया हो. पेज लोड करते समय, लाइटहाउस आपके नेटवर्क या सीपीयू को धीमा नहीं करता. इसके बजाय, यह देखा जाता है कि सामान्य परिस्थितियों में पेज को लोड होने में कितना समय लगा. इसके बाद, यह अनुमान लगाया जाता है कि तेज़ 3G नेटवर्क पर, आपकी मशीन के सीपीयू से चार गुना कम क्षमता वाले सीपीयू पर, पेज को लोड होने में कितना समय लगेगा.
4. पक्का करें कि स्टोरेज मिटाएं चेकबॉक्स चालू हो. यह विकल्प, Lighthouse को हर पेज रिसॉर्स के लिए नेटवर्क पर जाने के लिए मजबूर करता है. इससे, पहली बार आने वाले लोगों को पेज का अनुभव वैसा ही मिलता है जैसा कि नेटवर्क से कनेक्ट होने पर मिलता है.
5. ऑडिट चलाएं पर क्लिक करें. पांच से 10 सेकंड के बाद, Lighthouse आपको एक रिपोर्ट दिखाता है.

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

अपनी रिपोर्ट को समझना

आपकी रिपोर्ट में सबसे ऊपर दाईं ओर, परफ़ॉर्मेंस का कुल स्कोर दिखता है. 100 सबसे बेहतर स्कोर होता है. कुल स्कोर के नीचे, मेट्रिक के स्कोर दिखते हैं. Lighthouse v3 की स्कोरिंग गाइड में बताया गया है कि हर मेट्रिक का स्कोर, कुल स्कोर में कैसे योगदान देता है.

किसी मेट्रिक के बारे में ज़्यादा जानने के लिए, उस पर कर्सर घुमाएं. इसके बारे में दस्तावेज़ पढ़ने के लिए, ज़्यादा जानें पर क्लिक करें.

मेट्रिक के स्कोर के नीचे, आपको पेज के लोड होने के दौरान कैसा दिखता है, इसके स्क्रीनशॉट दिखते हैं.

स्क्रीनशॉट के नीचे, आपको पेज की परफ़ॉर्मेंस को बेहतर बनाने के अवसर दिखते हैं.

किसी अवसर के बारे में ज़्यादा जानने के लिए, उस पर क्लिक करें.

अगले चरण

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

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