Bezahlte Tests PLUS: Geschwindigkeitswächter und Benachrichtigungen

Im dritten Teil der Serie stellen wir Ihnen das Flaggschiff vor, oder vielmehr den Fahnenträger als Schlüsselmitglied der Armee der Neuerungen. Lassen Sie uns auf den Geschwindigkeitswächter konzentrieren.

Der Web-Geschwindigkeitswächter ist eine Kombination von Funktionen der bezahlten Tests PLUS, auf die Sie die Überwachung der Geschwindigkeit Ihrer Webseiten delegieren können. Ohne unnötige Komplexität, ohne Spam und ohne die Notwendigkeit, Daten zu interpretieren, am richtigen Ort und zur richtigen Zeit.

Warum führen wir den Geschwindigkeitswächter ein und was bietet die Konkurrenz nicht?#

Den PageSpeed.ONE-Geschwindigkeitstester entwickeln wir auf Basis von Recherchen zu konkurrierenden Tools zur Geschwindigkeitsmessung, vor allem aber auf Basis jahrelanger Erfahrung mit der Überwachung der Webgeschwindigkeit für Dutzende von Kunden unserer Web-Geschwindigkeitsberatung.

Wir möchten, dass unser Geschwindigkeitswächter...

• einfach zu benutzen ist, auch für Laien im Bereich Performance,
• den Nutzer nicht mit einer Flut von Informationslärm belastet,
• automatisch funktioniert, ohne ständige Anpassungen,
• und über verschiedene Kommunikationskanäle verfügbar ist.

Der Wächter entstand, weil kein verfügbares Tool unsere Bedürfnisse, geschweige denn die unserer Kunden, wirklich erfüllt. Worin genau unterscheidet sich der Wächter von PageSpeed.ONE?

1) Er sendet nur die unbedingt notwendigen Nachrichten#

Benachrichtigungs-E-Mails von allen existierenden Überwachungstools überfluten Sie früher oder später. Nur einige davon enthalten relevante und wichtige Änderungen der Webgeschwindigkeit. Wir selbst verbringen bei der Arbeit für Kunden Stunden pro Woche mit der Auswertung dieser Benachrichtigungen. Meistens handelt es sich nur um Fehlalarme, die Benachrichtigung hätte gar nicht kommen müssen.

2) Er konzentriert sich auf wichtige Metriken#

Traditionell verwendete Tools klammern sich an ältere Metriken wie die Ladezeit der Seite (Load-Event) oder erfinden eigene Metriken. Doch wir haben hier schon seit langem Metriken, die das Benutzererlebnis sehr gut widerspiegeln. Ja, im Tester konzentrieren wir uns auf Web Vitals-Metriken und unterstützende Indikatoren.

Lassen Sie uns nun die einzelnen Eigenschaften des Wächters näher betrachten.

Geschwindigkeitswächter#

Der „Geschwindigkeitswächter“-Bericht dient als Haupt-Dashboard für die gesamte Funktionalität der Überwachung und Berichterstattung der Webgeschwindigkeit.

Wir können ihn in folgendem Bild zusammenfassen:

Verschiedene Zustände in den Berichten des Geschwindigkeitswächters.

Lassen Sie uns die einzelnen Punkte kommentieren:

1. Zustand der Metriken – oben im Bericht „Geschwindigkeitswächter“ sehen wir die überwachten Metriken und ihren aktuellen Zustand. Wenn sie die festgelegten Grenzen einhalten, sind sie grün. „Defekte“ Metriken sehen Sie als rot.
2. Verschlechterung der Metrik – wenn Sie in den Grafiken mehrere Tage lang eine rote Linie sehen, wurde die Grenze für diese Metrik überschritten. Wir empfehlen, ihr Ihre Aufmerksamkeit zu widmen. Mehr zur Ursachenforschung finden Sie weiter unten im Artikel.
3. Neuberechnung der Grenze – die Grenze der Metrik, also die gestrichelte Linie im Diagramm, kann sich selbst neu berechnen, wenn die Metrik über einen Zeitraum von zwei Wochen einen guten Zustand aufweist. Ebenso, wenn die Metrik einen schlechten Zustand zeigt, der sich nicht ändert. Wir möchten nämlich auch eine Verschlechterung bereits schlechter Werte vermeiden, daher überwachen wir immer die aktuellen Werte.

Automatische Neuberechnung der Grenze. Nach zwei Wochen Verbesserung überwachen wir automatisch den neuen Metrikwert.

Der Schlüssel ist also die Geschwindigkeitsgrenze, der Metrikwert selbst und das Timing. Lassen Sie uns jedoch noch tiefer in die Materie einsteigen.

Wie funktioniert die Geschwindigkeitsüberwachung genau? Jeden Tag neue Daten und wenig Spam#

1. Messmethode – diese Zahlen werden mit dem Werkzeug Lighthouse gemessen, also synthetisch. Wir nehmen den Median der Messungen jeder URL und berechnen daraus den Durchschnitt. Das hat sich als ausreichend empfindliche Berechnung möglicher Veränderungen erwiesen.
2. Metriken – wir haben uns für Web Vitals-Metriken (LCP, CLS...) entschieden, ergänzen sie aber durch weitere unterstützende Metriken wie TTFB (Backend-Geschwindigkeit) oder TBT (Gesamtblockierungszeit von JS).
3. Zeit – die Überwachung erfolgt in zweiwöchigen Zyklen. Wenn sich die Metrik während dieser Zyklen nicht über oder unter einen bestimmten Wert ändert, bleibt die Grenze so eingestellt, wie sie war. Wenn sich der Wert ändert und dies länger als drei Tage anhält, benachrichtigen wir Sie und heben es im Diagramm hervor.
4. Grenze – im Diagramm sehen Sie sie als gestrichelte Linie. Die Grenze ist immer über dem Metrikwert festgelegt und hat keine optimalen Werte, sie basiert immer nur auf dem vorherigen Zustand. Dadurch können wir Änderungen in den Metriken gut erkennen.

Hier ist etwas schiefgelaufen. Eine Benachrichtigung erhalten Sie, wenn die Grenze der Metrik am dritten Tag in Folge überschritten wird. So vermeiden wir Situationen, in denen es zu einer einmaligen Schwankung kommt.

Es ist auch gut zu wissen, dass wir nach vielen Iterationen die Erkennung von Metrikänderungen auf Prozentbasis verworfen haben.

Zum Beispiel hat eine Änderung um 10 % bei einem niedrigen Metrikwert nicht die gleiche Bedeutung wie eine Änderung um 10 % bei einem höheren Metrikwert. Änderungen einiger Metriken haben zudem eine größere Bedeutung (sagen wir LCP als Teil von Web Vitals), während andere sich sehr häufig ändern (wie TBT und andere JavaScript-Metriken) und Grenzen daher weniger empfindlich eingestellt werden müssen.

In unserem Algorithmus verwenden wir daher intelligente Erkennungen, bei denen sich verschiedene Metriken in unterschiedlichen Werten unterschiedlich verhalten.

Das Hauptziel? Sie möglichst wenig mit unwichtigen Änderungen zu belästigen.

Was passiert, wenn ich die URL in den Einstellungen ändere?#

Eine Änderung oder Hinzufügung der URL im Testeinstellungen ändert natürlich aufgrund der Berechnungsmethode auch die Metrikwerte und wird wahrscheinlich eine Meldung über eine Verbesserung oder Verschlechterung der Metriken auslösen. Bei einer URL-Änderung wird nun automatisch eine Notiz im Diagramm hinzugefügt.

Benachrichtigungen - Slack, Teams, E-Mail#

Uns ist klar und wir wissen aus der Praxis mit Kunden, dass nicht jedes Team die Werkzeuge zur Geschwindigkeitsmessung so oft überwacht, wie es nötig wäre.

Bei der Gestaltung des Geschwindigkeitswächters hatten wir dies im Hinterkopf und unser Ziel war es, dass Sie idealerweise nur dann in die eigentliche Geschwindigkeits-Testanwendung gehen, wenn Sie ein konkretes Problem lösen.

Der Geschwindigkeitswächter bietet daher mehrere Möglichkeiten, wie Sie auf passive Weise Informationen über ein Problem oder eine Verbesserung erhalten können:

Achtung, hier ist etwas schiefgelaufen. Schauen Sie lieber nach.

E-Mail-Benachrichtigungen des Geschwindigkeitswächters gehen an jedes Mitglied des Teams. Wenn sie natürlich nicht deaktiviert werden, was mit einem Klick aus der eingehenden E-Mail möglich ist.

Lassen Sie sich wichtige, aber auch gute Nachrichten in Slack senden.

Benachrichtigungen in Slack und Teams sind sehr nützlich, wenn Sie diese Werkzeuge bereits für die interne Kommunikation verwenden.

Für die richtige Einrichtung von Slack und Teams sind ein paar Schritte erforderlich, darüber werden wir später schreiben und eine kurze Anleitung finden Sie in den Einstellungen jedes Tests.

Wie debuggen, also die Ursachen der Verschlechterung finden?#

Lassen Sie uns nun einen konkreten Fall der Problemsuche nach einer Wächtermeldung betrachten.

Eine Benachrichtigung trifft ein, dass sich die CLS-Metrik auf der Website verschlechtert hat. Im Diagramm sehen wir es dann ungefähr so:

Verlauf der CLS-Messung im Geschwindigkeitswächter.

So ist es, um den 5.9. hat sich die Metrik für kumulative Layout-Verschiebung deutlich verschlechtert.

Der Verlauf der Metrikentwicklung nach spezifischen URLs ist dann nach einem Klick ins Diagramm sichtbar:

In den Testergebnissen können wir sehen, welche Seiten am stärksten betroffen sind.

Hier ist zu erkennen, dass sich alle gemessenen URLs verschlechtert haben. Es ist also klar, dass die Ursache wahrscheinlich in einer Designänderung über die gesamte Website hinweg liegt.

Durch Klicken auf die spezifische Testzeit gelangen wir zum Lighthouse-Bericht im Detail:

Lighthouse-Testergebnisse für eine URL.

Hier sehen wir neben dem verschlechterten CLS-Wert auch die Möglichkeit, detaillierte Berichte herunterzuladen. Für das Debuggen von CLS ist die Trace besonders hilfreich, die wir in Tools wie dem Performance-Tab in Chrome DevTools öffnen können.

Hier konzentrieren wir uns auf Layout-Verschiebungen und sehen, dass die letzte durch eine asynchron gezeichnete obere Leiste verursacht wird. Das ist auch der Unterschied zu den vorherigen Messungen und ein Problem, das wir dem Entwicklungsteam melden können.

Der Wächter ist die wichtigste Funktion der Tests PLUS. Wir haben gesehen, dass uns mit Hilfe des Wächters kein Problem entgeht, Berichte können wir in verschiedenen Kanälen erhalten, und es werden nicht zu viele sein. Im eigentlichen Tester erhalten wir dann die Möglichkeit, das Problem zu finden.