Lighthouse अब परफ़ॉर्मेंस बजट के साथ काम करता है. LightWallet के नाम से जानी जाने वाली इस सुविधा को पांच मिनट के अंदर सेट अप किया जा सकता है. इससे परफ़ॉर्मेंस मेट्रिक के साथ-साथ, पेज पर उपलब्ध संसाधनों के साइज़ और संख्या के बारे में सुझाव, राय या शिकायत मिलती है.
Lighthouse इंस्टॉल करना
LightWallet, लाइटहाउस v5+ के कमांड-लाइन वर्शन में उपलब्ध है.
शुरू करने के लिए, Lighthouse इंस्टॉल करें:
npm install -g lighthouse
एक बजट बनाएँ
budget.json नाम की फ़ाइल बनाएं. इस फ़ाइल में यह JSON जोड़ें:
[
{
"path": "/*",
"timings": [
{
"metric": "interactive",
"budget": 3000
},
{
"metric": "first-meaningful-paint",
"budget": 1000
}
],
"resourceSizes": [
{
"resourceType": "script",
"budget": 125
},
{
"resourceType": "total",
"budget": 300
}
],
"resourceCounts": [
{
"resourceType": "third-party",
"budget": 10
}
]
}
]
इस उदाहरण budget.json फ़ाइल में पांच अलग-अलग बजट सेट किए गए हैं:
- टाइम टू इंटरैक्टिव के लिए 3000ms का बजट.
- फ़र्स्ट मीनिंगफ़ुल पेंट के लिए 1000 मिलीसेकंड का बजट
- पेज पर मौजूद कुल JavaScript के लिए 125 केबी का बजट.
- पेज के कुल साइज़ के लिए 300 केबी का बजट.
- तीसरे पक्ष के ऑरिजिन को किए गए अनुरोधों की संख्या के लिए, 10 अनुरोधों का बजट.
इस्तेमाल की जा सकने वाली परफ़ॉर्मेंस मेट्रिक और अलग-अलग तरह के संसाधनों की पूरी सूची देखने के लिए, लाइटहाउस दस्तावेज़ में मौजूद परफ़ॉर्मेंस बजट सेक्शन देखें.
Lighthouse चलाना
--budget-path फ़्लैग का इस्तेमाल करके Lighthouse चलाएं. इस फ़्लैग से Lighthouse को आपकी बजट फ़ाइल की जगह की जानकारी मिलती है.
lighthouse https://example.com --budget-path=./budget.json
नतीजे देखना
अगर LightWallet को सही तरीके से कॉन्फ़िगर किया गया है, तो लाइटहाउस रिपोर्ट में परफ़ॉर्मेंस कैटगरी में बजट सेक्शन होगा.
Lighthouse रिपोर्ट के JSON वर्शन में, performance-budget ऑडिट के नतीजों में Lightwallet के नतीजे देखे जा सकते हैं.