Lighthouse הוא כלי לבדיקת אתרים שעוזר למפתחים לקבל הזדמנויות וניתוחים לשיפור חוויית המשתמש באתרים שלהם.
Lighthouse 11 זמין באופן מיידי בשורת הפקודה דרך npm, ב-Chrome Canary וב-PageSpeed Insights. הוא יגיע לגרסה יציבה של Chrome בגרסה 118.
רשימת השינויים המלאה מופיעה ביומן השינויים 11.0.
עדכונים בקטגוריית נגישות
עדכונים בקטגוריות כוללים ביקורות אוטומטיות חדשות, שקלול משופר ובדיקות ידניות לפי תעדוף כדי לעזור למפתחים להפוך את האתרים שלהם לנגישים יותר.
ביקורות ושקלולים חדשים
מאז Lighthouse 10.0, נוספו 13 ביקורות חדשות של נגישות:
aria-allowed-role
aria-dialog-name
aria-text
html-xml-lang-mismatch
image-redundant-alt
input-button-name
label-content-name-mismatch
link-in-text-block
select-name
skip-link
table–duplicate-name
table-fake-caption
td-has-header
בנוסף לביקורות החדשות, המשקולות של כל הביקורות עודכנו כדי להתאים טוב יותר לרמות ההשפעה של כלל aXe. פרטים מדויקים על הביקורות והמשקולות החדשות זמינים במסמכי התיעוד בנושא ציון הנגישות ב-Lighthouse.
חשיפה של ביקורת ידנית
מערכת Lighthouse תמיד כללה כמה ביקורות ידניות שלא ניתן לבדוק באופן אוטומטי, ��בל הן עדיין נכללות כרשימת משימות לאימות פונקציונליות חשובה. קטע הביקורת הידנית מורחב עכשיו באופן אוטומטי לאחר שכל הביקורות האוטומטיות יסתיימו.
חשוב להדגיש שמעבר של כל הביקורות האוטומטיות וקבלת ציון של 100 בנגישות, לא מבטיחים שאפשר יהיה לגשת לדף המבוקר. עדיין חשוב לבצע בדיקות ידניות. בנוסף, שונה סדר הביקורות הידניות כדי להתחיל עם הבדיקות הנגיכות ביותר.
שינויים בביקורות קיימות
מאינטראקציה ועד הצגת התגובה (INP)
INP כבר לא ניסיוני, לכן המדד הועבר מ-experimental-interaction-to-next-paint
ל-interaction-to-next-paint
.
קובצי שירות (service worker)
אין יותר צורך בקובץ שירות (service worker) כדי שדף יהיה ניתן להתקנה כ-PWA ב-Chrome, לכן הבדיקה service-worker
הוסרה מקטגוריית ה-PWA של Lighthouse.
סיכום מקורות המידע
הביקורת resource-summary
הוסרה מדוח Lighthouse. עדיין אפשר לאסוף נתונים סטטיסטיים של בקשות רשת באמצעות הביקורת המוסתרת network-requests
:
const {lhr} = await lighthouse('https://example.com');
const networkRequests = lhr.audits['network-requests'].details.items;
const resourceSummary = {};
for (const request of networkRequests) {
let total = resourceSummary[request.resourceType] || 0;
total += request.resourceSize;
resourceSummary[request.resourceType] = total;
}
console.log(resourceSummary);
ניווט מדור קודם
הוסרו כל הדגל --legacy-navigation
עבור ה-CLI, הפונקציה legacyNavigation()
ב-Node API ותיבת הסימון 'Legacy navigation' (ניווט מדור קודם) בחלונית DevTools. המטרה היא להשלים מעבר של שנים בתשתית של Lighthouse למשך שנים, כדי לתמוך בזרימות המשתמשים.
מגדלור ריצה
Lighthouse זמין ב-Chrome DevTools, ב-npm (כמודול צומת וכלי CLI) וכתוסף לדפדפן (ב-Chrome וב-Firefox). הוא גם מפעיל מספר שירותים של Google, כולל PageSpeed Insights.
כדי לנסות את Lighthouse Node CLI, משתמשים בפקודות הבאות:
npm install -g lighthouse
lighthouse https://www.example.com --view
יצירת קשר עם הצוות של Lighthouse
כדי לדון בתכונות החדשות, בשינויים בגרסה 11 של Lighthouse או בכל נושא אחר שקשור ל-Lighthouse:
- אתם יכולים לדווח על בעיה או לשלוח משוב בכלי למעקב אחר בעיות ב-Lighthouse GitHub.
- אפשר לשאול שאלות בפורומי הדיונים של Lighthouse ב-GitHub.
- אפשר לפנות לצוות Lighthouse ב-Twitter @____lighthouse.