Ihr erstes Performance-Budget mit Lighthouse

Avatar of Robin Rendle
Robin Rendle am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Ire Aderinokun schreibt über eine neue Methode, um ein Performance-Budget festzulegen (und einzuhalten) mit Lighthouse, Googles Suite von Tools, die Entwicklern hilft zu sehen, wie performant und zugänglich ihre Websites sind.

Bis vor kurzem hatte ich auch kein offizielles Performance-Budget eingerichtet und durchgesetzt. Das heißt nicht, dass ich nie Performance-Audits durchgeführt habe. Ich nutze regelmäßig Tools wie PageSpeed Insights und setze das Feedback um, um Verbesserungen vorzunehmen. Aber was ich noch nie getan hatte, war, eine Liste von Metriken festzulegen, die die Website erfüllen musste, und diese mit einem automatisierten Tool durchzusetzen.

Die Gründe dafür waren eine Kombination aus Unwissenheit, welche genauen Zahlen ich für Budgets verwenden sollte, und einer Diskrepanz zwischen dem Festlegen eines Budgets und dessen Testen/Durchsetzung. Deshalb war ich wirklich begeistert, als das Lighthouse-Team auf der diesjährigen Google I/O die Unterstützung für Performance-Budgets ankündigte, die in Lighthouse integriert werden können. Wir können jetzt ein einfaches Performance-Budget in einer JSON-Datei definieren, das als Teil des Lighthouse-Audits getestet wird!

Ich stimme Ire vollkommen zu, und auf ähnliche Weise habe ich dazu geneigt, die Einhaltung eines Performance-Budgets zu vernachlässigen, einfach weil der Testprozess so manuell und mühsam war. Aber nicht mehr! Wie Ire in diesem Beitrag zeigt, können Sie Lighthouse sogar so einrichten, dass Ihr Budget bei jeder PR in GitHub getestet wird. Dieses Tool heißt lighthousebot und ist genau das, wonach ich gesucht habe – eine automatisierte und vorhersehbare Möglichkeit, ein Performance-Budget in jede Änderung zu integrieren, die ich an einer Codebasis vornehme.

Heute wird lighthousebot nach Abschluss eines Tests auf Ihre PR kommentieren und Ihnen die Vorher-Nachher-Bewertung anzeigen.

Wie genial ist das denn? Das erinnert mich an Gareth Clubbs kürzlichen Beitrag über die Verbesserung der Web-Performance und den Aufbau einer Kultur rund um Budgets in einem Unternehmen. Welcher bessere Weg, um alle an Performance zu erinnern, als direkt in GitHub nach jeder einzelnen Änderung, die sie vornehmen?

Direkter Link →