Lighthouse এখন পারফর্ম্যান্স বাজেট সাপোর্ট করে। LightWallet নামে পরিচিত এই ফিচারটি পাঁচ মিনিটেরও কম সময়ে সেট-আপ করা যায় এবং এটি পারফর্ম্যান্স মেট্রিক ও পৃষ্ঠার রিসোর্সের সাইজ ও পরিমাণ সম্পর্কে ফিডব্যাক প্রদান করে।
Lighthouse ইনস্টল করা
Lighthouse v5+ ভার্সনের কমান্ড লাইনে LightWallet উপলভ্য।
শুরু করতে, 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 ফাইলটি পাঁচটি আলাদা বাজেট সেট করে:
- Time to Interactive-এর জন্য ৩০০০ মিলি সেকেন্ডের বাজেট।
- পৃষ্ঠায় মোট জাভাস্ক্রিপ্টের জন্য ১২৫ কেবি বাজেট।
- পৃষ্ঠার সামগ্রিক সাইজের জন্য ৩০০ কেবি বাজেট।
- থার্ড-পার্টি অরিজিনে করা অনুরোধের সংখ্যার জন্য ১০টি অনুরোধের বাজেট।
সমর্থিত পারফর্ম্যান্স মেট্রিক্স এবং রিসোর্স প্রকারের সম্পূর্ণ তালিকার জন্য, Lighthouse ডকুমেন্টের পারফর্ম্যান্স বাজেট বিভাগটি দেখুন।
Lighthouse রান করুন
--budget-path ফ্ল্যাগ ব্যবহার করে Lighthouse রান করুন। এই ফ্ল্যাগ Lighthouse-কে আপনার বাজেট ফাইলের লোকেশন জানায়।
lighthouse https://example.com --budget-path=./budget.json
ফলাফল দেখুন
LightWallet সঠিকভাবে কনফিগার করা হলে, Lighthouse রিপোর্টে পারফর্ম্যান্স বিভাগের মধ্যে একটি বাজেট বিভাগ থাকবে।
Lighthouse রিপোর্টের JSON ভার্সনে, performance-budget অডিটের জন্য অডিট ফাইন্ডিংয়ের মধ্যে Lightwallet ফলাফল পাওয়া যাবে।