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

Brendan Kenny
Brendan Kenny

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

लाइटहाउस 9.0, कमांड लाइन पर, Chrome कैनरी में, और PageSpeed Insights में तुरंत उपलब्ध है. इसकी जगह, Chrome 98 में Chrome स्टेबल चैनल के तौर पर काम करेगी.

एपीआई से जुड़े बदलाव

इस रिलीज़ में ज़्यादातर उपयोगकर्ताओं को वर्कफ़्लो में रुकावट डालने वाले बदलाव नहीं करने चाहिए. अगर आप कस्टम लाइटहाउस ऑडिट चलाते हैं या ऐसे टूल इस्तेमाल करते हैं जो लाइटहाउस रिपोर्ट JSON में दी गई पूरी जानकारी पर निर्भर करते हैं, तो 9.0 में कुछ नुकसान पहुंचा सकने वाले बदलाव हो सकते हैं, जिनके बारे में आपको पता होना चाहिए.

9.0 बदलाव लॉग में बदलावों की पूरी सूची देखें.

यूज़र फ़्लो के लिए लाइटहाउस

लाइटहाउस में एक नया User-flow API है, जो किसी पेज के लंबे समय तक लैब टेस्टिंग की अनुमति देता है.

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

लाइटहाउस यूज़र-फ़्लो रिपोर्ट

ज़्यादा जानकारी के लिए, Lighthouse यूज़र फ़्लो का ट्यूटोरियल और कोड के सैंपल देखें.

रिपोर्ट रीफ़्रेश करें

लाइटहाउस रिपोर्ट को रीफ़्रेश किया गया है, ताकि उसे आसानी से पढ़ा जा सके, रिपोर्ट का सोर्स बनाया जा सके, और उसे ज़्यादा बेहतर तरीके से पढ़ा जा सके.

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

लाइटहाउस 9.0 रिपोर्ट, जिसमें परफ़ॉर्मेंस की अहम मेट्रिक को ज़्यादा प्रमुखता से दिखाया जाता है. साथ ही, इसमें परफ़ॉर्मेंस रिपोर्ट में पेज के फ़ाइनल लुक का स्क्रीनशॉट भी जोड़ा जाता है

रिपोर्ट के निचले हिस्से में दी गई खास जानकारी को भी फिर से डिज़ाइन किया गया है, ताकि यह बताया जा सके कि लाइटहाउस कैसे चलाया गया और रिपोर्ट कैसे इकट्ठा की गई.

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

नई रिपोर्ट को इस्तेमाल करने का तरीका देखने के लिए, लाइटहाउस 9.0 आज़माएं या इस उदाहरण रिपोर्ट पर जाएं.

सुलभता से जुड़ी एक आम समस्या तब होती है, जब किसी पेज पर यूनीक होनी चाहिए, वे नहीं होती हैं. उदाहरण के लिए, जब aria-labelledby एट्रिब्यूट में बताए गए आईडी का इस्तेमाल एक से ज़्यादा एलिमेंट पर किया गया हो.

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

लाइटहाउस 9.0 में, उस आईडी को शेयर करने वाले सभी एलिमेंट अब सूची में शामिल हो गए हैं:

'फ़ोकस करने लायक सभी एलिमेंट का एक यूनीक `आईडी` होना ज़रूरी है' के लिए, लाइटहाउस ऑडिट में एक ही `आईडी` वाले दो एलिमेंट दिखाए गए हों

यह "संबंधित नोड" यह सुविधा axe-core से मिलती है. इसलिए, हो सकता है कि यह अन्य सुलभता ऑडिट में भी दिखे.

ज़्यादा जानकारी के लिए, उपयोगकर्ता रिपोर्ट इकट्ठा करने से जुड़ी समस्या और लागू करने के लिए पुल का अनुरोध लेख पढ़ें.

रनिंग लाइटहाउस

लाइटहाउस, Chrome DevTools, npm (नोड मॉड्यूल और सीएलआई के तौर पर) और Chrome और Firefox में ब्राउज़र एक्सटेंशन के तौर पर उपलब्ध है. इसकी मदद से, Google की कई सेवाएं काम करती हैं. इनमें web.dev/measure और PageSpeed Insights शामिल हैं.

लाइटहाउस नोड सीएलआई को आज़माने के लिए, इन निर्देशों का इस्तेमाल करें:

npm install -g lighthouse
lighthouse https://www.example.com --view

लाइटहाउस टीम से संपर्क करें

नई सुविधाओं, 9.0 रिलीज़ में हुए बदलावों या लाइटहाउस से जुड़ी अन्य चीज़ों के बारे में चर्चा करने के लिए: