Lighthouse 6.0 में नया क्या है

नई मेट्रिक, परफ़ॉर्मेंस स्कोर का अपडेट, नए ऑडिट वगैरह.

आज हम Lighthouse 6.0 रिलीज़ कर रहे हैं!

Lighthouse, वेबसाइट की ऑडिटिंग करने वाला एक ऑटोमेटेड टूल है. इससे डेवलपर को अपनी साइटों के उपयोगकर्ता अनुभव को बेहतर बनाने के अवसर और गड़बड़ी की जानकारी मिलती है. यह Chrome DevTools, npm (Node मॉड्यूल और सीएलआई के तौर पर) या ब्राउज़र एक्सटेंशन (Chrome और Firefox में) के तौर पर उपलब्ध है. यह PageSpeed Insights के साथ-साथ, Google की कई सेवाओं को बेहतर बनाता है.

Lighthouse 6.0, npm और Chrome Canary पर तुरंत उपलब्ध है. Lighthouse का इस्तेमाल करने वाली Google की अन्य सेवाओं को इस महीने के आखिर तक अपडेट मिल जाएगा. यह सुविधा, Chrome के स्टैबल वर्शन में जुलाई के मध्य में रिलीज़ होने वाले Chrome 84 में उपलब्ध होगी.

Lighthouse Node CLI को आज़माने के लिए, इन कमांड का इस्तेमाल करें: bash npm install -g lighthouse lighthouse https://www.example.com --view

Lighthouse के इस वर्शन में कई बदलाव किए गए हैं. इन बदलावों के बारे में 6.0 के बदलावों की सूची में बताया गया है. हम इस लेख में, हाइलाइट के बारे में बताएंगे.

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

नई मेट्रिक

Lighthouse 6.0 में, रिपोर्ट में तीन नई मेट्रिक शामिल की गई हैं. इनमें से दो नई मेट्रिक, वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाली मेट्रिक के लैब वर्शन हैं. ये मेट्रिक हैं, सबसे बड़े एलिमेंट को रेंडर करने में लगने वाला समय (एलसीपी) और लेआउट शिफ़्ट होने में लगने वाला समय (सीएलएस).

सबसे बड़ा कॉन्टेंटफ़ुल पेंट (एलसीपी)

सबसे बड़े कॉन्टेंटफ़ुल पेंट (एलसीपी) से, पेज लोड होने के अनुभव का पता चलता है. यह मेट्रिक, पेज लोड होने के दौरान उस समय को मार्क करती है जब मुख्य या "सबसे बड़ा" कॉन्टेंट लोड हो जाता है और उपयोगकर्ता को दिखने लगता है. एलसीपी, फ़र्स्ट कॉन्टेंटफ़ुल पेंट (एफ़सीपी) का एक अहम हिस्सा है. एफ़सीपी सिर्फ़ पेज लोड होने की शुरुआती प्रोसेस को कैप्चर करता है. एलसीपी से डेवलपर को यह सिग्नल मिलता है कि उपयोगकर्ता किसी पेज का कॉन्टेंट कितनी तेज़ी से देख पा रहा है. 2.5 सेकंड से कम का एलसीपी स्कोर 'अच्छा' माना जाता है.

ज़्यादा जानकारी के लिए, पॉल आयरिश की एलसीपी के बारे में यह खास जानकारी देखें.

कुल लेआउट शिफ़्ट (सीएलएस)

कुल लेआउट शिफ़्ट (सीएलएस), विज़ुअल स्टैबिलिटी का मेज़रमेंट है. इससे पता चलता है कि किसी पेज का कॉन्टेंट, विज़ुअल तौर पर कितनी बार बदलता है. सीएलएस स्कोर कम होने का मतलब है कि डेवलपर को यह सिग्नल मिल रहा है कि उनके उपयोगकर्ताओं को कॉन्टेंट में अचानक बदलाव नहीं दिख रहा है. 0.10 से कम सीएलएस स्कोर को 'अच्छा' माना जाता है.

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

ज़्यादा जानकारी के लिए, ऐनी सुलिवन की सीएलएस के बारे में यह खास जानकारी देखें.

टोटल ब्लॉकिंग टाइम (टीबीटी)

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

इसके अलावा, टीबीटी, फ़ील्ड मेट्रिक पेज पर मौजूद लिंक को क्लिक करके उस पर पहुंचने वाला समय (एफ़आईडी) के साथ अच्छी तरह से जुड़ा हुआ है. यह मेट्रिक, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली मेट्रिक है.

परफ़ॉर्मेंस स्कोर से जुड़ा अपडेट

Lighthouse में परफ़ॉर्मेंस स्कोर का हिसाब, कई मेट्रिक के आधार पर लगाया जाता है. इससे, पेज की स्पीड के बारे में खास जानकारी मिलती है. परफ़ॉर्मेंस स्कोर 6.0 का फ़ॉर्मूला यहां दिया गया है.

फ़ेज़	मेट्रिक का नाम	मेट्रिक का वज़न
तय समय से पहले (15%)	First Contentful Paint (FCP)	15%
मीडियम (40%)	स्पीड इंडेक्स (एसआई)	15%
	सबसे बड़ा कॉन्टेंटफ़ुल पेंट (एलसीपी)	25%
देर से (15%)	टाइम टू इंटरैक्टिव (टीटीआई)	15%
मुख्य थ्रेड (25%)	टोटल ब्लॉकिंग टाइम (टीबीटी)	25%
अनुमान लगाने की क्षमता (5%)	कुल लेआउट शिफ़्ट (सीएलएस)	5%

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

तुलना के लिए, यहां वर्शन 5 का स्कोर दिया गया है:

फ़ेज़	मेट्रिक का नाम	वज़न
तय समय से पहले (23%)	First Contentful Paint (FCP)	23%
मीडियम (34%)	स्पीड इंडेक्स (एसआई)	27%
	फ़र्स्ट मीनिंगफ़ुल पेंट (एफ़एमपी)	7%
पूरा हो गया (46%)	टाइम टू इंटरैक्टिव (टीटीआई)	33%
	फ़र्स्ट सीपीयू आइडल (एफ़सीआई)	13%
मुख्य थ्रेड	ज़्यादा से ज़्यादा संभावित एफ़आईडी	0%

Lighthouse के वर्शन 5 और 6 के बीच स्कोरिंग में हुए बदलावों की कुछ खास बातें:

• टीटीआई का वेट 33% से घटाकर 15%कर दिया गया है. यह बदलाव, TTI में होने वाले बदलावों के बारे में उपयोगकर्ताओं के सुझाव, शिकायत या राय के आधार पर किया गया है. साथ ही, मेट्रिक ऑप्टिमाइज़ेशन में होने वाली गड़बड़ियों की वजह से, उपयोगकर्ता अनुभव को बेहतर बनाने के लिए भी यह बदलाव किया गया है. जब कोई पेज पूरी तरह से इंटरैक्टिव होता है, तब भी TTI एक काम का सिग्नल होता है. हालांकि, टिबीटी के साथ इसका इस्तेमाल करने पर, पेज के लोड होने में लगने वाले समय में कम बदलाव होता है. स्कोरिंग में हुए इस बदलाव से, हमें उम्मीद है कि डेवलपर को उपयोगकर्ता के इंटरैक्शन को ऑप्टिमाइज़ करने के लिए ज़्यादा बढ़ावा मिलेगा.
• एफ़सीपी का वेट 23% से घटाकर 15% कर दिया गया है. सिर्फ़ तब मेज़र करने पर जब पहला पिक्सल पेंट किया गया हो (FCP), तो हमें पूरी जानकारी नहीं मिलती. इसे, उपयोगकर्ताओं को वह कॉन्टेंट दिखने में लगने वाले समय (एलसीपी) को मेज़र करने के साथ जोड़ने से, लोड होने के अनुभव को बेहतर तरीके से दिखाया जा सकता है.
• ज़्यादा से ज़्यादा संभावित एफ़आईडी का इस्तेमाल बंद कर दिया गया है. यह अब रिपोर्ट में नहीं दिखता है, लेकिन यह अब भी JSON में उपलब्ध है. हमारा सुझाव है कि अब mpFID के बजाय, इंटरैक्टिविटी का आकलन करने के लिए टीबीटी का इस्तेमाल करें.
• फ़र्स्ट मीनिंगफ़ुल पेंट मेट्रिक का इस्तेमाल बंद कर दिया गया है. यह मेट्रिक बहुत अलग-अलग थी और इसे स्टैंडर्ड बनाने का कोई भी सही तरीका नहीं था. इसकी वजह यह है कि इसे लागू करने का तरीका, Chrome के रेंडरिंग इंटरनल के हिसाब से खास होता है. कुछ टीमों को अपनी साइट पर एफ़एमपी के समय को फ़ायदेमंद लगता है. हालांकि, इस मेट्रिक में कोई और सुधार नहीं किया जाएगा.
• इस्तेमाल में न होने वाले पहले सीपीयू (CPU) का आंकड़ा इस्तेमाल नहीं किया जा सकता, क्योंकि यह टीटीआई से काफ़ी अलग नहीं है. अब इंटरैक्टिविटी के लिए, टीबीटी और टीटीआई सबसे सही मेट्रिक हैं.
• सीएलएस का वज़न कम है. हालांकि, हमें उम्मीद है कि आने वाले समय में, हम इसे बड़े वर्शन में बढ़ा देंगे.

स्कोर में बदलाव

इन बदलावों से असल साइटों के स्कोर पर क्या असर पड़ता है? हमने दो डेटासेट का इस्तेमाल करके, स्कोर में हुए बदलावों का विश्लेषण पब्लिश किया है: साइटों का सामान्य सेट और Eleventy की मदद से बनाई गई स्टैटिक साइटों का सेट. खास जानकारी के तौर पर, ~20% साइटों को काफ़ी ज़्यादा स्कोर मिले हैं, ~30% साइटों में काफ़ी कम बदलाव हुए हैं, और ~50% साइटों को कम से कम पांच पॉइंट की गिरावट मिली है.

स्कोर में हुए बदलावों को तीन मुख्य हिस्सों में बांटा जा सकता है:

• स्कोर के वेटेज में बदलाव
• मेट्रिक लागू करने से जुड़ी गड़बड़ियां ठीक की गईं
• अलग-अलग स्कोर कर्व में हुए बदलाव

स्कोर के वज़न में हुए बदलावों और तीन नई मेट्रिक के इस्तेमाल की वजह से, स्कोर में ज़्यादातर बदलाव हुए. वर्शन 6 के परफ़ॉर्मेंस स्कोर में, उन नई मेट्रिक का अहम योगदान होता है जिन्हें डेवलपर ने अब तक ऑप्टिमाइज़ नहीं किया है. वर्शन 5 में, टेस्ट कॉर्पस की परफ़ॉर्मेंस का औसत स्कोर करीब 50 था. वहीं, ब्लॉकिंग का कुल समय और सबसे बड़ा कॉन्टेंटफ़ुल पेंट की नई मेट्रिक के औसत स्कोर करीब 30 थे. लाइटहाउस के वर्शन 6 के परफ़ॉर्मेंस स्कोर में, इन दोनों मेट्रिक का 50% वेट होता है. इसलिए, ज़्यादातर साइटों के स्कोर में गिरावट आई है.

मेट्रिक की गिनती करने की प्रोसेस में मौजूद गड़बड़ियों को ठीक करने पर, अलग-अलग स्कोर मिल सकते हैं. इससे कुछ साइटों पर असर पड़ता है. हालांकि, कुछ मामलों में इसका असर काफ़ी ज़्यादा हो सकता है. कुल मिलाकर, मेट्रिक लागू करने के तरीके में हुए बदलावों की वजह से, करीब 8% साइटों का स्कोर बेहतर हुआ. वहीं, मेट्रिक लागू करने के तरीके में हुए बदलावों की वजह से, करीब 4% साइटों का स्कोर कम हुआ. इन सुधारों से, करीब 88% साइटों पर कोई असर नहीं पड़ा.

अलग-अलग स्कोर कर्व में हुए बदलावों का भी स्कोर में हुए बदलावों पर असर पड़ा, हालांकि यह असर बहुत कम था. हम समय-समय पर यह पक्का करते हैं कि स्कोर कर्व, HTTPArchive डेटासेट में मौजूद मेट्रिक के साथ अलाइन हो. लागू करने के दौरान हुए बड़े बदलावों से जिन साइटों पर असर पड़ा है उन्हें छोड़कर, अलग-अलग मेट्रिक के लिए स्कोर कर्व में किए गए छोटे बदलावों से, करीब 3% साइटों के स्कोर में सुधार हुआ है और करीब 4% साइटों के स्कोर में गिरावट आई है. करीब 93% साइटों पर इस बदलाव का कोई असर नहीं पड़ा.

स्कोरिंग कैलकुलेटर

हमने स्कोरिंग कैलकुलेटर पब्लिश किया है, ताकि आपको परफ़ॉर्मेंस स्कोर के बारे में जानकारी मिल सके. कैलकुलेटर से आपको Lighthouse के वर्शन 5 और 6 के स्कोर की तुलना भी दिखती है. Lighthouse 6.0 की मदद से ऑडिट करने पर, रिपोर्ट में कैलकुलेटर का लिंक दिखता है. इसमें आपके नतीजे अपने-आप भर जाते हैं.

नए ऑडिट

इस्तेमाल न किया गया JavaScript

हम एक नए ऑडिट में DevTools कोड कवरेज का इस्तेमाल कर रहे हैं: इस्तेमाल न किया गया JavaScript.

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

सुलभता ऑडिट

Lighthouse, सुलभता कैटगरी को बेहतर बनाने के लिए, axe-core लाइब्रेरी का इस्तेमाल करता है. हमने Lighthouse 6.0 में ये ऑडिट जोड़े हैं:

• aria-hidden-body
• aria-hidden-focus
• aria-input-field-name
• aria-toggle-field-name
• form-field-multiple-labels
• heading-order
• duplicate-id-active
• duplicate-id-aria

मास्केबल आइकॉन

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

Charset एलान

meta charset एलिमेंट से यह पता चलता है कि एचटीएमएल दस्तावेज़ को समझने के लिए, किस कैरेक्टर एन्कोडिंग का इस्तेमाल किया जाना चाहिए. अगर यह एलिमेंट मौजूद नहीं है या दस्तावेज़ में देर से एलान किया गया है, तो ब्राउज़र यह अनुमान लगाने के लिए कई हेयुरिस्टिक्स का इस्तेमाल करते हैं कि किस एन्कोडिंग का इस्तेमाल किया जाना चाहिए. अगर ब्राउज़र का अनुमान गलत होता है और देर से मेटा कोड वाला एलिमेंट मिलता है, तो आम तौर पर पार्स करने वाला टूल अब तक किए गए सभी काम को खारिज कर देता है और फिर से शुरू करता है. इससे, उपयोगकर्ता को खराब अनुभव मिलता है. इस नए ऑडिट से यह पुष्टि की जाती है कि पेज पर मान्य वर्ण एन्कोडिंग है और इसे शुरुआत में और साफ़ तौर पर बताया गया है.

Lighthouse CI

पिछले साल नवंबर में सीडीएस में, हमने Lighthouse CI का एलान किया था. यह एक ओपन सोर्स Node CLI और सर्वर है, जो आपकी सीआई (कंटिन्यूअस इंटिग्रेशन) पाइपलाइन में हर कमिट पर Lighthouse के नतीजों को ट्रैक करता है. अल्फा रिलीज़ के बाद से, हमने काफ़ी तरक्की की है. Lighthouse CI में अब कई सीआई (कंट्रोल इंटिग्रेशन) सेवा देने वाली कंपनियों के साथ काम करने की सुविधा है. इनमें Travis, Circle, GitLab, और GitHub Actions शामिल हैं. डिप्लॉय करने के लिए तैयार डॉकर इमेज की मदद से, सेटअप करना आसान हो जाता है. साथ ही, ज़्यादा जानकारी वाले विश्लेषण के लिए, डैशबोर्ड को फिर से डिज़ाइन किया गया है. इससे Lighthouse में हर कैटगरी और मेट्रिक के रुझान दिखते हैं.

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

Chrome DevTools पैनल का नाम बदला गया

हमने ऑडिट पैनल का नाम बदलकर Lighthouse पैनल कर दिया है. बस इतना ही!

DevTools विंडो के साइज़ के हिसाब से, हो सकता है कि पैनल » बटन के पीछे हो. क्रम बदलने के लिए, टैब को खींचें और छोड़ें.

कमांड मेन्यू की मदद से, पैनल को तुरंत देखने के लिए:

1. DevTools खोलने के लिए, `Control+Shift+J` दबाएं. Mac पर, `Command+Option+J` दबाएं.
2. Command मेन्यू खोलने के लिए, Control+Shift+P (या Mac पर Command+Shift+P) दबाएं.
3. "Lighthouse" टाइप करना शुरू करें.
4. Enter दबाएं.

मोबाइल एम्युलेशन

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

• धीमे नेटवर्क और सीपीयू की स्थितियों को सिम्युलेट किया गया (Lantern नाम के सिम्युलेशन इंजन की मदद से).
• डिवाइस की स्क्रीन को एमुलेट करना (यह वही सुविधा है जो Chrome DevTools में मिलती है).

शुरुआत से ही, Lighthouse ने अपने रेफ़रंस डिवाइस के तौर पर Nexus 5X का इस्तेमाल किया है. पिछले कुछ सालों में, ज़्यादातर परफ़ॉर्मेंस इंजीनियर, टेस्टिंग के लिए Moto G4 का इस्तेमाल कर रहे हैं. अब Lighthouse भी ऐसा ही कर रहा है और उसने अपने रेफ़रंस डिवाइस को Moto G4 में बदल दिया है. असल में, यह बदलाव बहुत ज़्यादा नहीं दिखता, लेकिन वेबपेज से पता चलने वाले सभी बदलाव यहां दिए गए हैं:

• स्क्रीन का साइज़ 412x660 पिक्सल से बदलकर 360x640 पिक्सल हो गया है.
• उपयोगकर्ता एजेंट स्ट्रिंग में थोड़ा बदलाव किया गया है. डिवाइस का वह हिस्सा जो पहले Nexus 5 Build/MRA58N था, अब Moto G (4) हो जाएगा.

Chrome 81 के बाद, Moto G4 भी Chrome DevTools के डिवाइस इम्यूलेशन की सूची में उपलब्ध है.

ब्राउज़र एक्सटेंशन

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

Lighthouse को स्थानीय तौर पर चलाने के बजाय, एक्सटेंशन अब PageSpeed Insights API का इस्तेमाल करता है. हम समझते हैं कि यह हमारे कुछ उपयोगकर्ताओं के लिए, ज़रूरत के मुताबिक विकल्प नहीं होगा. इनमें ये मुख्य अंतर हैं:

• PageSpeed Insights, सार्वजनिक नहीं की गई वेबसाइटों का ऑडिट नहीं कर सकता. ऐसा इसलिए, क्योंकि यह आपके स्थानीय Chrome इंस्टेंस के बजाय, रिमोट सर्वर के ज़रिए चलाया जाता है. अगर आपको किसी ऐसी वेबसाइट का ऑडिट करना है जो सार्वजनिक नहीं है, तो DevTools के Lighthouse पैनल या Node CLI का इस्तेमाल करें.
• यह ज़रूरी नहीं है कि PageSpeed Insights, Lighthouse के नए वर्शन का इस्तेमाल करे. अगर आपको सबसे नई रिलीज़ का इस्तेमाल करना है, तो Node CLI का इस्तेमाल करें. ब्राउज़र एक्सटेंशन को रिलीज़ होने के करीब एक से दो हफ़्ते बाद अपडेट मिलेगा.
• PageSpeed Insights, Google का एक एपीआई है. इसका इस्तेमाल करने का मतलब है कि आपने Google एपीआई की सेवा की शर्तें स्वीकार कर ली हैं. अगर आपको सेवा की शर्तें स्वीकार नहीं करनी हैं या स्वीकार नहीं की जा सकती हैं, तो DevTools के Lighthouse पैनल या Node CLI का इस्तेमाल करें.

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

बजट मैनेज करना

Lighthouse 5.0 में परफ़ॉर्मेंस बजट की सुविधा जोड़ी गई है. इसकी मदद से, किसी पेज पर हर तरह के रिसॉर्स (जैसे, स्क्रिप्ट, इमेज या सीएसएस) के लिए थ्रेशोल्ड जोड़े जा सकते हैं.

Lighthouse 6.0 में, बजट मेट्रिक के लिए सहायता जोड़ी गई है. इसलिए, अब आपके पास एफ़सीपी जैसी खास मेट्रिक के लिए थ्रेशोल्ड सेट करने का विकल्प है. फ़िलहाल, बजट की सुविधा सिर्फ़ Node CLI और Lighthouse CI के लिए उपलब्ध है.

सोर्स की जगह के लिंक

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

आने वाले समय में

Lighthouse ने नई सुविधाओं को बेहतर बनाने के लिए, सोर्स मैप इकट्ठा करने की सुविधा पर प्रयोग करना शुरू किया है. जैसे:

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

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

lighthouse https://web.dev --view --preset experimental

धन्यवाद!

Lighthouse का इस्तेमाल करने और सुझाव देने के लिए धन्यवाद. आपके सुझाव, शिकायत या राय से हमें Lighthouse को बेहतर बनाने में मदद मिलती है. हमें उम्मीद है कि Lighthouse 6.0 की मदद से, आपको अपनी वेबसाइटों की परफ़ॉर्मेंस को बेहतर बनाने में आसानी होगी.

अब आपके पास क्या विकल्प हैं?

• Chrome Canary खोलें और Lighthouse पैनल को आज़माएं.
• Node सीएलआई का इस्तेमाल करें: npm install -g lighthouse && lighthouse https://yoursite.com --view.
• अपने प्रोजेक्ट के साथ Lighthouse CI को चलाएं.
• Lighthouse ऑडिट से जुड़ा दस्तावेज़ पढ़ें.
• वेब को बेहतर बनाने का आनंद लें!

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