Lighthouse 8.4 ist ab sofort über die Befehlszeile und in Chrome Canary verfügbar. Sie wird in Chrome 95 als stabile Version von Chrome eingeführt und innerhalb einer Woche in PageSpeed Insights verfügbar sein.
Verwenden Sie die folgenden Befehle, um die Lighthouse Node-Befehlszeile auszuprobieren:
npm install -g lighthouse
lighthouse https://www.example.com --view
Eine vollständige Liste der Änderungen finden Sie im Änderungsprotokoll für 8.4.
Neue Prüfungen
Largest Contentful Paint-Bilder nicht per Lazy Loading laden
Lazy Loading von Bildern kann eine effektive Methode sein, um nicht sichtbare Bilder aufzuschieben, damit sie das Laden von Inhalten, die sich „above the fold“ befinden, nicht beeinträchtigen.
Wenn das LCP-Element einer Seite jedoch ein Bild ist, kann sich Lazy Loading erheblich negativ auf den LCP auswirken. Der Browser kann das Bild in die Warteschlange stellen und zuerst andere Ressourcen abrufen, anstatt das Bild für den sofortigen Download zu priorisieren. Eine aktuelle Studie zum Lazy Loading in WordPress ergab, dass der LCP bei einigen Websites um bis zu 15% verbessert werden kann, wenn Bilder im anfänglichen Darstellungsbereich nicht Lazy Loading verwendet werden.
Lighthouse erkennt jetzt, ob das LCP-Element ein Lazy-Loading-Bild ist, und empfiehlt, das loading-Attribut daraus zu entfernen.
Weitere Informationen finden Sie im ersten Vorschlag und in der Pull-Anfrage für die Implementierung.
Mobilen Darstellungsbereich für ein besseres First Input Delay festlegen
Die Prüfung „viewport“ gehört schon seit Jahren zur Kategorie „Best Practices“. In 8.4 wird dieser Rat aber auch in der Kategorie „Leistung“ willkommen heißen.
Viele mobile Browser unterstützen "Zum Zoomen doppeltippen" mit dem Nutzer Inhalte, die nicht für mobile Bildschirme entwickelt wurden, leicht vergrößern können, d. h. Inhalte ohne explizites <meta name="viewport">-Symbol für Mobilgeräte. In der Praxis bedeutet das, dass der Browser nach dem Tippen des Nutzers bis zu 300 ms warten muss, um zu sehen, ob ein zweiter Vorgang erfolgt. Während dieser Zeit kann die Seite nicht auf das erste Tippen reagieren. Dies führt zu einem fehlgeschlagenen FID von mehreren hundert Millisekunden.
In einer aktuellen Studie aus dem HTTP-Archiv wurde festgestellt, dass mehr als die Hälfte der Websites, die in Lighthouse eine Punktzahl von 90 oder höher erreicht haben, aber bei mindestens einem Core Web Vital nicht erfolgreich waren, keinen mobilen Darstellungsbereich haben und FID nicht bestanden haben. Daher wird im Abschnitt zur Lighthouse-Leistung jetzt empfohlen, einen Darstellungsbereich wie den folgenden hinzuzufügen, falls keiner gefunden wird:
<meta name="viewport" content="width=device-width">
Weitere Informationen finden Sie unter Angebotsproblem und Pull-Anfrage zur Implementierung.
Lighthouse-Team kontaktieren
Die neuen Funktionen, Änderungen in Version 8.4 oder andere Funktionen mit Lighthouse sind hier:
- Über das Lighthouse-GitHub-Repository können Sie ein Problem melden oder Feedback geben.
- Dann wenden Sie sich einfach an das Lighthouse-Team auf Twitter: @____lighthouse.