توفِّر Lighthouse الآن الميزانيات للأداء. يمكن إعداد هذه الميزة، المعروفة باسم LightWallet، في أقل من خمس دقائق وتقدم ملاحظات حول مقاييس الأداء وحجم موارد الصفحة وكميتها.
تثبيت Lighthouse
تتوفّر ميزة LightWallet في إصدار سطر الأوامر من الإصدار 5 أو الإصدارات الأحدث من Lighthouse.
للبدء، عليك تثبيت 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 خمس ميزانيات منفصلة:
- ميزانية قدرها 3000 ملّي ثانية لوقت التفاعل.
- ميزانية قدرها 1,000 ملّي ثانية لسرعة عرض أوّل محتوى مفيد على الصفحة
- ميزانية قدرها 125 كيلوبايت لإجمالي حجم JavaScript على الصفحة.
- ميزانية قدرها 300 كيلوبايت للحجم الإجمالي للصفحة.
- ميزانية مكوّنة من 10 طلبات لعدد الطلبات المقدَّمة إلى مصادر تابعة لجهات خارجية
للحصول على قائمة كاملة بمقاييس الأداء وأنواع المراجع المتوافقة، يُرجى الرجوع إلى قسم ميزانيات الأداء في مستندات Lighthouse.
تشغيل Lighthouse
يمكنك تشغيل Lighthouse باستخدام العلامة --budget-path. تُعلم هذه العلامة أداة Lighthouse بموقع ملف الميزانية.
lighthouse https://example.com --budget-path=./budget.json
عرض النتائج
في حال ضبط LightWallet بشكل صحيح، سيحتوي تقرير Lighthouse على قسم الميزانيات ضمن فئة الأداء.
في إصدار JSON من تقرير Lighthouse، يمكن العثور على نتائج Lightwallet ضمن نتائج التدقيق الخاصة بتدقيق performance-budget.