Diese Seite wurde von der Cloud Translation API übersetzt.

Weiterentwicklung von Lighthouse: kontinuierliche Integration, neue Formel zur Leistungsbewertung und mehr

Hier erhalten Sie die neuesten Lighthouse-Updates und -Statistiken vom Chrome Developer Summit 2019.

Elizabeth Sweeny

Beim Speed Tooling Evolutions-Vortrag auf dem Chrome Developer Summit (CDS) haben Paul Irish und ich die neuesten Produkte und Features von Google vorgestellt, mit denen ihr für alle eure Nutzer eine außergewöhnlich schnelle Nutzererfahrung entwickeln und aufrechterhalten könnt. Im Mittelpunkt stehen Ergänzungen der Lighthouse-Familie mit Tools zur Leistungsüberwachung.

Alphaversion von Lighthouse CI

Das Lighthouse-Team hat die Alphaversion von Lighthouse CI veröffentlicht, dem neuen Produkt für kontinuierliche Integration, mit dem Sie Lighthouse bei jedem Commit ausführen können, bevor Sie die Produktion starten. Lighthouse CI führt Lighthouse mehrmals aus, bestätigt statische Audit- oder Messwertschwellen und lädt dann Lighthouse-Berichte auf einen Server hoch, um visuelle Unterschiede und einen grundlegenden Bewertungsverlauf der Kategorie zu ermöglichen. Vorhandene budgets.json-Konfigurationen funktionieren nahtlos zusammen mit der neuen Ausdruckssyntax, um alle Lighthouse-Audit- oder Kategorieergebnisse zu bestätigen.

Lighthouse CI unterstützt standardmäßig Travis CI, Circle CI und GitHub Actions sowie jeden Ubuntu- oder containerbasierten CI-Dienst mit einer gewissen Konfiguration. Sie können den Lighthouse-CI-Server lokal installieren oder ein Docker-Image für die sofortige Einrichtung verwenden. Alternativ können Sie sofort mit dem kostenlosen, öffentlichen, temporären Lighthouse-Berichtspeicher beginnen.

Demnächst verfügbar: Updates zum Leistungswert

Änderungen bei der Lighthouse-Leistungsbewertung in Version 6! In Version 5 (Stand: November 2019) hat Lighthouse fünf Messwerte, die gewichtet und kombiniert werden, um eine Leistungsbewertung von 0 bis 100 zu bilden: First Contentful Paint, Speed Index, First Meaningful Paint, Time to Interactive und First CPU Idle.

Vergleich der Lighthouse-Formeln zur Leistungsbewertung in den Versionen 5 und 6.

Ausführliche Informationen finden Sie unter Lighthouse-Leistungsbewertung.

In Lighthouse Version 6 werden „First CPU Idle“ (FCI) und „First Meaningful Paint“ (FMP) durch die neuen Messwerte Largest Contentful Paint (LCP) und Total Blocking Time (TBT) ersetzt. Die Gewichtungen der fünf Messwerte werden so angepasst, dass die verschiedenen Phasen von Last- und Interaktivitätsmessungen besser aufeinander abgestimmt werden.

Das Lighthouse-Team arbeitet weiter daran, dass alle Bewertungskurven verfeinert und die Messwerte ausgereift sind und gründlich getestet werden. Die Leistungsbewertung von Lighthouse v6 soll im Januar 2020 veröffentlicht werden.

Hinweis : Performance Engineers sind mit den Ergebnissen von Geschwindigkeitstools manchmal aufgrund zweier eigener Herausforderungen schwierig zu reproduzieren: der Variabilität und umgebungsübergreifenden Inkonsistenzen. Variabilität ist das Problem dafür, dass sich die Zahlen auch dann ändern, wenn die Testumgebung gleich bleibt. Umgebungsübergreifende Inkonsistenzen sind das Problem, wenn Tests auf derselben Seite in unterschiedlichen Umgebungen (z. B. Entwicklertools und PageSpeed Insights) ausgeführt werden. Das Lighthouse-Team arbeitet daran, Abweichungen zu reduzieren. Dennoch ist es hilfreich, die Ursachen für Schwankungen und die richtigen Maßnahmen zu kennen. Das Lighthouse-Team untersucht auch Kalibrierungsmethoden, um Unterschiede zwischen Umgebungen zu reduzieren. Es ist jedoch zu erwarten, dass unterschiedliche Bedingungen und Hardware zu unterschiedlichen Messungen führen – zumindest vorerst.

Lighthouse-Stapelpakete

Lighthouse kann automatisch erkennen, ob Websites ein Framework oder ein Content-Management-System (CMS) verwenden, und stackspezifische Empfehlungen in den Bericht aufnehmen. Stack Packs bieten zusätzlich zu den grundlegenden Audits von Lighthouse individuelle Empfehlungen, die von Community-Experten zusammengestellt werden.

Empfehlung des Lighthouse-Berichts zum Verschieben von nicht sichtbaren Bildern in React-Anwendungen.

Im Moment gibt es Stack Packs für Angular, WordPress, Magento, React und AMP. Wenn Sie ein eigenes Stack Pack erstellen möchten, rufen Sie das GitHub-Repository auf oder wenden Sie sich an das Lighthouse-Team.

Demnächst verfügbar: Lighthouse-Plug-ins als Chrome-Erweiterungen

Lighthouse-Plug-ins sind eine weitere Möglichkeit, die Erweiterbarkeit von Lighthouse zu nutzen. Es gibt viele Qualitätsprüfungen, die mit Lighthouse-Core-Audits derzeit nicht abgedeckt werden, entweder weil sie nur für eine Untergruppe von Entwicklern gelten oder das Team noch nicht die Kapazitäten hatte, die Audits zu erstellen.

Mit Lighthouse-Plug-ins können Community-Experten neue Prüfungen implementieren, die Lighthouse ausführen und dem Bericht als neue Kategorie hinzufügen können. Derzeit funktionieren Plug-ins nur in der Lighthouse-Befehlszeile. Das Ziel ist jedoch, sie auch in den Entwicklertools im Bereich Audits auszuführen.

Bereich „Audits“ der Chrome-Entwicklertools mit Optionen zum Ausführen von Lighthouse-Plug-ins für Google Publisher-Anzeigen und Nutzererfahrung. — Community-Plug-ins im Bereich „Audits“ der Entwicklertools (Beta)

Wenn Nutzer Lighthouse-Plug-in-Erweiterungen aus dem Chrome Web Store installieren, werden die installierten Plug-ins von den Entwicklertools identifiziert und als Option im Bereich Audits angeboten. Das Lighthouse-Team wird die Unterstützung für den Plug-in-Ansatz in den kommenden Monaten entwickeln. Bleiben Sie dran. In der Zwischenzeit können Sie schon heute ein Plug-in als Knotenmodul erstellen und es allen Lighthouse-Nutzern über die Befehlszeile zugänglich machen.

Weitere Informationen

Weitere Informationen zu Lighthouse und anderen Leistungstools-Updates vom CDS 2019 finden Sie im Vortrag zu den Speed Tooling-Entwicklungen:

Ihr Feedback ist für die Verbesserung von Lighthouse von unschätzbarem Wert. Probieren Sie also Lighthouse CI aus, schreiben Sie ein Stack Pack oder erstellen Sie ein Lighthouse-Plug-in und lassen Sie uns Ihre Meinung wissen.