Lighthouse הוא כלי לבדיקת אתרים שעוזר למפתחים לקבל הזדמנויות וניתוחים לשיפור חוויית המשתמש באתרים שלהם.
Lighthouse 10 זמין באופן מיידי בשורת הפקודה עד Npm וב-Chrome Canary. הוא יגיע לגרסה יציבה של Chrome ב-Chrome 112 וב-PageSpeed Insights בשבועות הקרובים.
שינויים בניקוד
אנחנו מסירים את המדד המפורסם Time To Interactive (TTI) ב-Lighthouse 10, ומתווסף לתהליך ההוצאה משימוש שהתחיל ב-Lighthouse 8. משקל הציון של 10% ב-TTI עובר ל-Cumulative Layout Shift (CLS), שיהווה עכשיו 25% מציון הביצועים הכולל.
TTI מסמן נקודה בזמן, אבל אופן ההגדרה הופך אותה לרגישות מדי לבקשות רשת חיצוניות ולמשימות ארוכות. המהירות שבה נטען רכיב התוכן הכי גדול (LCP) ואינדקס המהירות בדרך כלל מספקים נתונים טובים יותר לגבי טעינה של תוכן הדף, בהשוואה למספר בקשות הרשת הפעילות. זמן חסימה כולל (TBT) בינתיים, הטיפול במשימות ארוכות ובזמינות של ה-thread הראשי נעשה בצורה יעילה יותר, למרות שלא מדובר בשרת proxy ישיר, אבל יש התאמה טובה יותר למדדי ליבה לבדיקת חוויית המשתמש באתר כפי שנמדדים בשדה.
המשקל המוגדל של CLS הוא אקראי להסרה של TTI, אבל הוא משקף טוב יותר את חשיבותו כמדד ליבה לבדיקת חוויית המשתמש באתר. באופן אידיאלי, הוא יתמקד יותר באתרים שעדיין מתבצעים שינויים לא נחוצים בפריסה.
אנחנו צופים שהדבר ישפר את ציוני הביצועים של רוב הדפים, כי רוב הדפים נוטים לקבל ציון טוב יותר ב-CLS בהשוואה ל-TTI. בניתוח של 13 מיליון דפים בהפעלה האחרונה של ארכיון HTTP, נמצא ש-90% מהדפים האלה הבחינו בשיפור בציון הביצועים של Lighthouse, ו-50% מהם הבחינו בשיפור בביצועים של יותר מ-5 נקודות.
אם מסיבה כלשהי עדיין יש צורך בערך TTI של Lighthouse (לדוגמה, בטענת CI), הוא עדיין זמין ללא שינוי בפלט ה-JSON של Lighthouse, רק עם ציון משקל של 0 והוא מוסתר בדוח ה-HTML. כל גישה באמצעות סקריפטים לערך ה-JSON אמורה להמשיך לפעול ללא שינויים.
ביקורות חדשות
Lighthouse 10 מספק ביקורת חדשה לחלוטין של הביצועים ושינוי משמעותי בדוגמה אחרת.
מטמון לדף הקודם/הבא
המטמון לדף הקודם/הבא (bfcache) הוא אחד מהכלים הכי חזקים שזמינים לשיפור הביצועים של דף למשתמשים אמיתיים. מעבר למטמון הרגיל של הדפדפן, דף שנטען מתוך המטמון לדף הקודם/הבא ישחזר את מצב הביצוע והפריסה של הדף באופן כמעט מיידי, תוך דילוג על כל הפעילות של טעינת הדף והצגת הדף למשתמשים מיד כשהם מנווטים אחורה וקדימה בהיסטוריה שלהם.
עם זאת, יש כמה דרכים שבהן דף יכול למנוע מהדפדפן לשחזר דף מהמטמון לדף הקודם/הבא. הביקורת החדשה הזו של Lighthouse מנווטת למעשה מדף הבדיקה וחוזרת ממנו, כדי לבדוק אם ניתן להשתמש בה במטמון לדף הקודם/הבא, ומפרטת את הסיבות לכך שהבדיקה נכשלה.
למידע נוסף, אפשר לעיין במסמכי הביקורת של bfcache.
שיטות קלט שמונעות הדבקה
הביקורת הישנה של השיטות המומלצות, "מאפשרים למשתמשים להדביק בשדות של סיסמאות" הורחבה, ועכשיו אפשר לוודא שהדבקה בשדה להזנת קלט (לא לקריאה בלבד) תעבוד. ברוב האתרים, מניעת ההדבקה היא חוויית משתמש שלילית מאוד ומונעת תהליכי עבודה לגיטימיים של בטיחות ונגישות.
הביקורת החדשה נקראת עכשיו "משתמשים יכולים להדביק בשדות להזנת קלט" (paste-preventing-inputs
).
משתמשי צומת
אם אתם משתמשים ב-Lighthouse כספריית צמתים, בגרסה הזו יהיו כמה שינויי תוכנה שעלולים לגרום לכשלים פרוגרמטיות. פרטים מלאים זמינים ביומן השינויים 10.0.
בנוסף, Lighthouse 10 כולל הצהרות מלאות מסוג TypeScript! עכשיו צריך להקליד את כל מה שיובא מ-lighthouse
, שיכול לעזור במיוחד בכתיבת סקריפטים של זרימת משתמש ב-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
כדי לדון בתכונות החדשות, בשינויים בגרסה 10 של Lighthouse או בכל נושא אחר שקשור ל-Lighthouse:
- אתם יכולים לדווח על בעיה או לשלוח משוב בכלי למעקב אחר בעיות ב-Lighthouse GitHub.
- אפשר לשאול שאלות בפורומי הדיונים של Lighthouse ב-GitHub.
- אפשר לפנות לצוות Lighthouse ב-Twitter @____lighthouse.