Performance-Budgets (Leistungsgrenzen von Webseiten)

Performance-Budgets sind eine Methode, um die Geschwindigkeit von Webseiten auf einem festgelegten Niveau zu halten. Stellen Sie sich ein Budget als Grenzwert für verschiedene Metriken vor.

Tools, die die Leistungsgrenzen von Webseiten überwachen, warnen uns bei Überschreitungen vor potenziellen Problemen. Das hilft Teams, die festgelegte Geschwindigkeit beizubehalten, selbst wenn neuer Inhalt hinzugefügt oder Funktionen geändert werden.

Performance-Budget für den Metrikwert TTFB (Serverantwortzeit)

Wie helfen Leistungsgrenzen bei der Optimierung der Geschwindigkeit?#

Performance-Budgets sind eine Reihe von Regeln, die sicherstellen, dass Seiten schnell und benutzerfreundlich bleiben. Grenzen funktionieren gut mit verschiedenen Messungen – sowohl synthetisch als auch RUM.

Es ist ratsam, die Leistungsgrenzen für alle wichtigen Metriken zu überwachen. Insbesondere empfehlen wir die Überwachung von Metriken aus dem Satz Core Web Vitals und weiteren unterstützenden Metriken. Die Liste der überwachten Metriken könnte so aussehen:

• Time to First Byte (TTFB)
• First Contentful Paint (FCP)
• Largest Contentful Paint (LCP)
• Cumulative Layout Shift (CLS)
• Interactive to Next Paint (INP)
• Total Blocking Time (TBT)

Beachten Sie jedoch, dass zwischen synthetischen und RUM Messungen erhebliche Unterschiede in den Metriken bestehen.

Synthetische Messungen sind auf die Metrikmessung während des Seitenladens beschränkt, was bedeutet, dass Ergebnisse für Metriken wie INP oder CLS hier nicht verfügbar oder ungenau sind. Daher sollten synthetische CLS-Ergebnisse gegenüber Benutzerdaten (CrUX) als teilweise betrachtet werden, und anstelle der INP-Metrik in der Synthese sollte TBT überwacht werden.

Warum empfehlen wir allen, Performance-Budgets zu überwachen?#

Die Ladegeschwindigkeit von Webseiten beeinflusst direkt die Benutzererfahrung und damit auch die Geschäftsergebnisse. Eine langsame Seite kann die Konversionsrate senken und die Absprungrate erhöhen.

Performance-Budgets helfen, dieses Ziel zu erreichen:

• Konsistente Metrikniveaus beibehalten.
  Durch das Festlegen von Grenzen vermeiden Sie Probleme beim Einführen neuer Funktionen oder Inhalte.
• Automatische Überwachung.
  Mit automatischen Warnungen bei Problemen müssen Sie nicht ständig manuell überwachen.
• Langfristiges Testen in stabiler Umgebung.
  Durch die Erhaltung derselben Testumgebung können Sie den aktuellen Stand und die Entwicklung mit historischen Daten vergleichen.

Wie stellt man Performance-Budgets richtig ein?#

Wenn Sie Tools für das Monitoring der Webgeschwindigkeit verwenden, werden Ihnen Tipps nützlich sein, um die Grenzen richtig einzustellen.

Beispiel für Performance-Budgets in SpeedCurve.

Wenn Sie die Leistungsgrenzen manuell einstellen, empfehlen wir Ihnen folgendes grundlegendes Vorgehen:

• Analyse und Festlegung der Grenzen.
  Betrachten Sie die Daten der letzten 2 bis 4 Wochen und identifizieren Sie die schlimmsten Fälle. Setzen Sie das Budget basierend auf den schlechtesten Ergebnissen. Dies ist ein sehr wichtiger Punkt, da die Missverständnisse bezüglich der Leistungsgrenzen oft auftreten. Sie spiegeln wirklich den aktuellen Stand wider. Setzen Sie sie nicht zum Beispiel auf das Niveau der Erfüllung der Core Web Vitals Metriken. Dies sind Ihre langfristigen Ziele.
• Beginnen Sie mit den Hauptmetriken.
  Es wird empfohlen, sich auf einige Schlüsselmessgrößen wie TTFB oder LCP zu konzentrieren und nach Bedarf weitere Metriken hinzuzufügen.
• Regelmäßige Überprüfung und Aktualisierung.
  Webseiten entwickeln sich ständig weiter; daher ist es ratsam, die Grenzen regelmäßig basierend auf aktuellen Benutzerdaten zu aktualisieren.

Für ein tieferes Verständnis der allgemeinen Problematik der Festlegung von Leistungsgrenzen empfehlen wir Artikel auf der MDN-Website, im SpeedCurve-Blog oder von Harry Roberts.

Monitoring PLUS geht die Leistungsgrenzen anders an#

In unserem Monitoring PLUS setzen wir im Rahmen der Performance-Budgets, im Gegensatz zum traditionellen Ansatz, die aktuellen Metrikniveaus vollautomatisch fest.

Leistungsgrenzen finden Sie im Bericht Wachhund. Der Wachhund überwacht täglich die Geschwindigkeit der gemessenen Seiten Ihrer Website. Wenn sich eine Schlüsselmetrik ändert, warnt Sie der Geschwindigkeitswachhund automatisch.

Im Gegensatz zu anderen Tools arbeitet der Wachhund ohne aktive Aufmerksamkeit und ohne Spam. So können Sie sich auf das Wesentliche Ihrer Projekte konzentrieren.

Funktion des Geschwindigkeitswachhunds im Monitoring PLUS.

Erklären wir uns, was Sie auf dem Bild sehen:

1. Die Metrik LCP hat sich verbessert, sodass eine automatische Neuberechnung auf niedrigere Werte erfolgt ist.
2. Es kommt zu einer sprunghaften Verschlechterung der Metrik.
3. Sollte es sich nicht um eine vorübergehende Änderung handeln, sendet der Wachhund eine Benachrichtigung.
4. Auch nach zwei Wochen wurde das Problem nicht behoben, also speichert der Wachhund das neue Niveau zur Überwachung der LCP-Metrik.

Was lässt sich abschließend sagen? Die Geschwindigkeit von Webseiten neigt dazu, sich zu verschlechtern. Die Methodik der Performance-Budgets dient dazu, das bestehende Niveau zu halten und Änderungen zu überwachen. Die wesentlichste Eigenschaft des Monitorings ist dabei die Fähigkeit, diese Grenzen zu überwachen und Sie auf potenzielle Probleme aufmerksam zu machen.

Wenn Sie die Grenzen überschreiten und herausfinden müssen, was sich genau geändert hat, hilft Ihnen Lighthouse Diff – ein Tool zum visuellen Vergleich zweier Lighthouse-Berichte.