Lighthouse הוא כלי לבדיקת אתרים שעוזר למפתחים לקבל הזדמנויות וניתוחים לשפר את חוויית המשתמש באתרים שלהם.
Lighthouse 10 זמין באופן מיידי בשורת הפקודה דרך npm וב-Chrome Canary. בשבועות הקרובים הוא יגיע לגרסה היציבה של Chrome בגרסה 112, ובשבועות הקרובים PageSpeed Insights.
שינויים בניקוד
אנחנו מסירים את המדד המפורסם Time to Interactive (TTI) ב-Lighthouse 10. כתוצאה מכך, תהליך ההוצאה משימוש התחיל ב-Lighthouse 8. המשקל לציון 10% ב-TTI עובר למודל Cumulative Layout Shift (CLS), שיהווה עכשיו 25% מציון הביצועים הכולל.
מדד 'דברים שאפשר לעשות' (TTI) מסמנת נקודת זמן, אבל באופן ההגדרה שלה היא רגישה מדי לבקשות רשת חריגות ולמשימות ארוכות. המהירות שבה נטען רכיב התוכן הכי גדול (LCP) ומדד המהירות הם בדרך כלל מדדים טובים יותר למקרים שבהם תוכן הדף נטען יותר מאשר מספר הבקשות הפעילות לרשת. זמן חסימה כולל (TBT), לעומת זאת, מטפל במשימות ארוכות ובזמינות של שרשור ראשי באופן יעיל יותר. למרות שלא מדובר בשרת proxy ישיר, השילוב הזה נוטה להיות טוב יותר במדדי הליבה לבדיקת חוויית המשתמש באתר, כפי שנמדד בשטח.
המשקל המוגדל של CLS הוא אירוע מקרי להסרה של TTI, אבל משקפת בצורה טובה יותר את החשיבות של מדד ליבה לבדיקת חוויית המשתמש באתר, ורצוי שהוא יגביר את המיקוד באתרים שעדיין מבצעים שינויי פריסה מיותרים.
אנחנו צופים שהפעולה הזו תשפר את רוב הדפים מאחר שרוב הדפים נוטים לקבל דירוג גבוה יותר ב-CLS בהשוואה ל-TTI. בניתוח של 13 מיליון טעינות של דפים בהרצה האחרונה של ארכיון HTTP, נראה שיפור בציון הביצועים ב-90% מהדפים האלה ב-Lighthouse, ו-50% מהם יבחינו בשיפור של יותר מ-5 נקודות.
אם מסיבה כלשהי יש עדיין צורך בערך 'TTD' של Lighthouse (למשל, בטענת הנכונות (assertion) של CI, הוא עדיין זמין ללא שינוי בפלט JSON של Lighthouse, רק עם משקל הציון 0 ומוסתר בדוח ה-HTML. כל גישה באמצעות סקריפט לערך JSON אמורה להמשיך לפעול ללא שינויים.
ביקורות חדשות
במסגרת Lighthouse 10, אנחנו עורכים בדיקת ביצועים חדשה לגמרי ושינוי משמעותי נוסף.
מטמון לדף הקודם/הבא
מטמון לדף הקודם/הבא (bfcache) הוא אחד מהכלים היעילים ביותר שזמינים לשיפור ביצועי דף אצל משתמשים אמיתיים. מעבר למטמון הרגיל של הדפדפן, דף שנטען מהמטמון לדף הקודם/הבא ישחזר את מצב הפריסה והביצוע של הדף באופן כמעט מיידי, ולרוב ידלג על כל פעילות טעינת הדפים ויציג את הדף למשתמשים מיד כשהם מנווטים אחורה וקדימה בהיסטוריה שלהם.
עם זאת, יש כמה דרכים שבהן דף יכול למנוע מהדפדפן לשחזר דף מהמטמון לדף הקודם/הבא. הביקורת החדשה של Lighthouse כדי לצאת מדף הבדיקה ולחזור לדף הזה, כדי לבדוק אם אפשר לשמור במטמון לדף הקודם/הבא, ומפרטת את הסיבות לכך אם היא נכשלת.
מידע נוסף זמין במסמכים של ביקורת bfcache.
קלט מניעת הדבקה
בקטע 'שיטות מומלצות' הקודם, הביקורת 'משתמשים יכולים להדביק בשדות של סיסמאות' הורחב כדי לבדוק שההדבקה בכל שדה להזנת קלט (שאינו לקריאה בלבד) תפעל. ברוב האתרים, מניעת ההדבקה יוצרת חוויית משתמש שלילית ומונעת תהליכי עבודה לגיטימיים לשמירה על הבטיחות והנגישות.
הביקורת החדשה נקראת עכשיו 'משתמשים יכולים להדביק בשדות להזנת קלט' (paste-preventing-inputs).
משתמשים בצומת
אם אתם משתמשים ב-Lighthouse כספריית Node, יש בגרסה הזו מספר שינויי תוכנה שעלולים לגרום לכשל פרוגרמטיות, שאולי תצטרכו להביא בחשבון. פרטים מלאים זמינים ביומן שינויים 10.0.
Lighthouse 10 יש גם הצהרות מלאות מסוג TypeScript! עכשיו צריך להקליד את כל מה שמיובא מ-lighthouse, והוא יעזור במיוחד לסקריפטים לתהליכים של משתמשים ב-Lighthouse.
כדאי לנסות את הסוגים ולהודיע לנו אם נתקלת בבעיות בשימוש בהם.
מגדלור פועל
Lighthouse זמין ב-Chrome DevTools, ב-npm (כמודול Node וככלי CLI), וכתוסף לדפדפן (ב-Chrome וב-Firefox). היא גם מפעילה מספר שירותים של Google, כולל PageSpeed Insights.
כדי לנסות את ה-CLI של Lighthouse Node, משתמשים בפקודות הבאות:
npm install -g lighthouse
lighthouse https://www.example.com --view
פנייה לצוות של Lighthouse
כדי לדון בתכונות החדשות, בשינויים בגרסה 10 של Lighthouse או בכל נושא אחר שקשור ל-Lighthouse:
- ניתן לדווח על בעיה או לשלוח משוב דרך הכלי למעקב אחר בעיות ב-Lighthouse GitHub.
- אפשר לשאול שאלות בפורומים לדיון של Lighthouse ב-GitHub.
- אתם יכולים ליצור קשר עם צוות Lighthouse ב-Twitter @____lighthouse.