Lighthouse ist ein automatisiertes Open-Source-Tool zur Verbesserung der Qualität Ihrer Webanwendungen. Sie können es als Chrome-Erweiterung installieren oder als Node-Befehlszeilentool ausführen. Wenn Sie Lighthouse eine URL geben, wird eine Reihe von Tests für die Seite ausgeführt und dann ein Bericht erstellt, in dem die Leistung der Seite erläutert und Verbesserungsmöglichkeiten angezeigt werden.
Wir freuen uns, heute die Veröffentlichung der Version 1.5 von Lighthouse mit mehr als 128 PRs ankündigen zu können. Lighthouse 1.5 enthält eine Reihe großer neuer Funktionen, Prüfungen und die üblichen Fehlerkorrekturen. Sie können sie von npm (npm i -g lighthouse) installieren oder die Erweiterung aus dem Chrome Web Store herunterladen.
Neue Audits
Die Prüfung der CSS-Nutzung meldet die Anzahl der nicht verwendeten Stilregeln auf Ihrer Seite sowie die Kosten- und Zeiteinsparungen durch das Entfernen dieser Regeln:
Die Prüfung der optimierten Images meldet nicht optimierte Images sowie die Kosten- und Zeiteinsparungen bei der Optimierung:
Die Prüfung der responsiven Bilder meldet Bilder, die zu groß sind, sowie die potenziellen Kosten- und Zeiteinsparungen bei der richtigen Größe für das jeweilige Gerät:
Unter Prüfungen zu Einstellungen und Eingriffen werden Konsolenwarnungen von Chrome aufgeführt, wenn Ihre Seite eingestellte APIs oder Funktionen mit Eingriffen verwendet:
Änderungen melden
Wie Sie gesehen haben, haben wir uns darauf konzentriert, den Bericht visuell übersichtlicher zu gestalten. Dazu haben wir tabellarische Daten hinzugefügt, irrelevante Hilfetexte ausgeblendet und neue Funktionen hinzugefügt, um das Navigieren durch die Daten zu erleichtern.
Emulationseinstellungen
Oft wird leicht vergessen, welche Drosselungs- und Emulationseinstellungen für eine bestimmte Lighthouse-Ausführung verwendet wurden. Lighthouse-Berichte enthalten jetzt die Einstellungen für die Laufzeitemulation, die zum Erstellen des Berichts verwendet wurden, eine Anfrage für lange Funktionen:
Weitere nützliche Trace-Daten
Lighthouse-Messwerte wie „First sinnvolle Paint“, „Zeit bis Interaktivität“ usw. werden als Nutzertiming gemessen und wieder in die mit dem Flag --save-assets gespeicherten Trace-Daten eingefügt.
Wenn Sie das Flag --save-assets verwenden, können Sie den Trace jetzt in die Entwicklertools einfügen oder in der Zeitachse der Entwicklertools öffnen.
Sie können Ihre wichtigsten Messwerte im Kontext mit dem vollständigen Trace des Seitenaufbaus sehen.
Lighthouse-Betrachter
In HTML-Berichten sehen Sie eine neue Schaltfläche mit Optionen zum Exportieren von Berichten in verschiedene Formate. Eine der Optionen ist „Im Viewer öffnen“. Wenn Sie auf diese Schaltfläche klicken, wird der Bericht an den Online Viewer gesendet, wo Sie ihn mit GitHub-Nutzern teilen können.
Im Hintergrund erhält der Viewer über OAuth die Berechtigung, einen GitHub-Secret-Gist zu erstellen und den Bericht dort zu speichern. Da es sich um Ihren Gist handelt, behalten Sie die volle Kontrolle über die Freigabe des Berichts und können ihn jederzeit löschen. Sie können die Berechtigung des Betrachters zum Erstellen von gists in den GitHub-Einstellungen widerrufen.
Leistungstest
Die erste Version des Projekts Performance Experiment ist in Version 1.5.0 verfügbar. So können Sie die Leistung beim Seitenaufbau testen und während der Entwicklung interaktiv testen, wie sich das Blockieren oder Verzögern von Assets in Ihrem kritischen Pfad auswirkt.
Wenn Lighthouse mit dem Flag --interactive ausgeführt wird, wird ein spezieller Bericht generiert, der eine interaktive Auswahl kostspieliger Seitenressourcen ermöglicht. Der Testserver führt dann Lighthouse auf dieser Seite noch einmal aus, wobei diese Ressourcen blockiert sind.
Weitere Informationen zum Leistungstest in Lighthouse
Neue Dokumentation
Nicht zuletzt haben wir die Dokumentation unter developers.google.com/web/tools/lighthouse/ modernisiert und neue Audit-Referenzen hinzugefügt.
Das war es erst einmal.
Alle aktuellen Informationen zu Lighthouse finden Sie in den vollständigen Versionshinweisen auf GitHub. Wie immer können Sie sich gern an uns wenden, um Fehler zu melden, Funktionsanfragen zu stellen oder Ideen dazu zu sammeln, was Sie als Nächstes sehen möchten.