Real User Monitoring (RUM)
Real User Monitoring (RUM) misst die Core Web Vitals in den Browsern der Menschen, die Ihre Website besuchen. Sie binden ein kleines Skript in Ihre Seiten ein, und LoadFocus zeigt LCP, INP, CLS, FCP und TTFB am 75. Perzentil, pro Seite und pro Gerät. Außerdem zeigt es, was sie verlangsamt: die Elemente, Bilder und Skripte hinter den Zahlen und wie sie sich nach Land, Browser, Verbindung und Navigationsart unterscheiden.
Labor-Läufe zeigen, wie schnell eine Seite von einem Standort mit einem Geräteprofil sein kann. RUM zeigt, wie schnell sie für Ihre Besucher ist. Es funktioniert auch dort, wo die Feld-Daten aus dem Chrome UX Report nichts anzeigen, denn es hängt nicht davon ab, dass Google genug Chrome-Traffic für Ihre Website hat.
Eine Website hinzufügen
- Klicken Sie in der Seitenleiste der Page-Speed-App auf RUM oder öffnen Sie speed.loadfocus.com/rum. Die Seite listet Ihre Websites.
- Klicken Sie auf Website hinzufügen, geben Sie unter Name der Website einen Namen und unter Hostnamen die Hostnamen der Website ein, und klicken Sie auf Website anlegen.
- Öffnen Sie die Website und kopieren Sie das Snippet unter Einbinden. Fügen Sie es in den
<head>jeder Seite ein.
Trennen Sie Hostnamen durch Kommas, bis zu 10 pro Website. Seitenaufrufe werden nur von diesen Hostnamen gezählt, und *.example.com deckt example.com und jede Subdomain ab. Die Prüfung der Hostnamen hält gelegentliche Verfälschungen Ihrer Zahlen fern, der Website-Schlüssel im Snippet ist aber öffentlich. Betrachten Sie die Zahlen daher als Besucherdaten, nicht als Sicherheitsmaßnahme.
Sendet Ihre Website eine strikte Referrer-Policy: no-referrer, schickt der Browser mit dem Beacon keinen Origin mit, und diese Seitenaufrufe werden nicht gezählt. Aktivieren Sie für eine solche Website in ihren Einstellungen Seitenaufrufe von Seiten ohne Origin akzeptieren. Der Hostname wird dann aus dem Snippet übernommen, das jede Seite fälschen könnte. Lassen Sie die Option daher aus, wenn Ihre Website sie nicht braucht.
Das Snippet
<script async src="https://speed.loadfocus.com/rum.js" data-site="YOUR_SITE_KEY"></script>
Im Snippet auf der Seite der Website ist Ihr Website-Schlüssel bereits eingetragen. Das Skript lädt nach Ihrer Seite und sendet einen kleinen Beacon, wenn der Besucher die Seite verlässt oder den Tab ausblendet.
Drei optionale Einstellungen:
Stichprobe.
data-sample="0.25"misst ein Viertel der Seitenaufrufe. Seitenaufrufe außerhalb der Stichprobe werden gar nicht gemessen. Die Auswahl Messen über dem Snippet auf der Seite der Website setzt den Wert für Sie.Seitennamen. Standardmäßig wird jede Seite nach ihrem Pfad benannt. Um Seiten selbst zu gruppieren, setzen Sie
window.LOADFOCUS_RUM_PAGEauf der Seite, zum Beispielwindow.LOADFOCUS_RUM_PAGE = "/product/:id";.Festgeschriebene Version. Auf der Seite der Website erzeugt Diese Version festschreiben (Subresource Integrity) ein Snippet, das eine eingefrorene Kopie des Skripts mit ihrem Integritäts-Hash lädt:
<script async src="https://speed.loadfocus.com/rum.v1.js" integrity="sha384-..." crossorigin="anonymous" data-site="YOUR_SITE_KEY"></script>Nichts, was LoadFocus ausrollt, kann dieses Skript ändern, und der Browser lehnt es ab, wenn es je vom Hash abweicht. Den echten Hash kopieren Sie von der Seite der Website. Für eine spätere Version installieren Sie das neue Snippet. Das einfache
rum.js-Snippet lädt immer die aktuelle Version.
Wenn Ihre Website eine Content-Security-Policy sendet, erlauben Sie https://speed.loadfocus.com in script-src (das Skript) und in connect-src (der Beacon).
Was gemessen wird
| Metrik | Gut | Verbesserung nötig | Schlecht |
|---|---|---|---|
| Largest Contentful Paint (LCP) | <= 2.5 s | <= 4 s | > 4 s |
| Interaction to Next Paint (INP) | <= 200 ms | <= 500 ms | > 500 ms |
| Cumulative Layout Shift (CLS) | <= 0.1 | <= 0.25 | > 0.25 |
| First Contentful Paint (FCP) | <= 1.8 s | <= 3 s | > 3 s |
| Time to First Byte (TTFB) | <= 800 ms | <= 1.8 s | > 1.8 s |
LCP, INP und CLS sind die Core Web Vitals. Die Werte folgen denselben Regeln wie Googles Bibliothek web-vitals: LCP endet bei der ersten Eingabe, CLS ist die größte Folge von Layout-Verschiebungen, INP lässt pro 50 Interaktionen einen Ausreißer weg, und Darstellungen in einem im Hintergrund geöffneten Tab zählen nicht. Jeder Seitenaufruf wird als mobil oder Desktop eingestuft.
Pro Seitenaufruf wird ein Beacon gesendet. Eine Seite, die aus dem Back/Forward-Cache des Browsers wiederhergestellt wird, zählt als neuer Seitenaufruf, so wie Googles Bibliothek web-vitals sie meldet.
Seitenaufrufe von Bots, Crawlern, Headless-Browsern, Laborwerkzeugen wie Lighthouse (LoadFocus-Monitore eingeschlossen) und Skripten werden nicht gezählt. Die Seite der Website zeigt, wie viele in den letzten 24 Stunden ausgelassen wurden.
Datenschutz
Das Skript setzt keine Cookies und speichert nichts im Browser. Jeder Beacon enthält den Seitenpfad, die Geräteklasse und die Zahlen sowie das, was sie erklärt:
- Kurze CSS-Selektoren der Elemente hinter LCP, INP und CLS: das Tag, die ID und bis zu zwei Klassennamen, nie Text oder andere Attribute.
- Die Adresse des LCP-Bildes und des langsamsten Skripts, ohne Query-String.
- Den Verbindungstyp und wie die Seite geöffnet wurde (normaler Aufruf, neu geladen, zurück oder vor).
Außerdem:
- Query-String und Hash der Seite werden nie gesendet.
- IDs, Zahlen, Tokens und E-Mail-Adressen in Pfaden werden als
:idzusammengefasst, sodass/orders/48213und/orders/48214beide als/orders/:idgezählt werden. - Die IP-Adresse des Besuchers wird im Arbeitsspeicher verwendet, um das Land zu ermitteln, und als täglich wechselnder Hash für die Ratenbegrenzung. Sie wird nie gespeichert.
Pfade und Element-IDs stammen von Ihren eigenen Seiten. Wenn ein Pfad einen Namen enthalten kann, zum Beispiel /u/jane.doe, geben Sie diesen Seiten mit window.LOADFOCUS_RUM_PAGE einen gemeinsamen Namen. In einen Cookie-Banner müssen Sie nichts aufnehmen.
Das Dashboard lesen
Jede Website hat ihre eigene Seite. Wählen Sie den Zeitraum (7 Tage, 28 Tage oder 90 Tage), dann sehen Sie:
- Eine Kachel pro Metrik mit ihrem p75, gefärbt als gut, Verbesserung nötig oder schlecht, dem Anteil der Seitenaufrufe in jedem Bereich und dem Anteil, der gut ist.
- Ein Tagesdiagramm des p75 für die angeklickte Metrik, mit den Grenzen für gut und schlecht als gestrichelte Linien und den Seitenaufrufen als blasse Balken.
- Seiten: Ihre meistbesuchten Seiten mit ihren Aufrufen und p75 für LCP, INP und CLS. Seiten jenseits der ersten 300 verschiedenen Pfade eines Tages werden als (weitere Seiten) gezählt. Fahren Sie mit der Maus über den LCP einer Seite, um ihre vier Phasen zu sehen.
- Geräte: der Anteil der Seitenaufrufe und p75 für LCP, INP und CLS für Mobil und Desktop.
Die Zahlen erscheinen wenige Minuten nach den ersten Besuchen.
Jede Website auf der Seite RUM zeigt Empfängt Daten oder Warten auf den ersten Seitenaufruf. Ein p75, der auf weniger als 30 Seitenaufrufen beruht, wird grau als Zu wenige für eine Bewertung mit seiner Anzahl angezeigt, weil er noch stark schwanken kann. Die Tage im Diagramm sind UTC-Tage.
Was Ihre Seiten verlangsamt
Unter Seiten und Geräten zeigt jede Website, was hinter ihren Zahlen steckt. Das sammelt dasselbe Snippet, es gibt also nichts einzurichten.
Was LCP verlangsamt
Ein Balken teilt LCP in vier Phasen, jeweils am 75. Perzentil:
- Zeit bis zum ersten Byte: bis das erste Byte der Seite ankommt.
- Ladeverzögerung: von da an, bis der Browser beginnt, das LCP-Bild herunterzuladen.
- Ladedauer: der Download des Bildes.
- Renderverzögerung: vom Ende des Downloads, bis das Bild oder der Text gezeichnet ist.
Ein LCP aus Text hat keine Ladeverzögerung und keine Ladedauer. Jede Phase ist ein eigenes Perzentil, die vier ergeben zusammen also nicht den LCP-Wert oben. Unter dem Balken listet Element die Elemente, die der LCP waren, als kurzen CSS-Selektor, mit Typ (Bild oder Text), Aufrufen und LCP, und Bild listet die LCP-Bilder nach Adresse.
Was INP verlangsamt
Ein Balken teilt die langsamste Interaktion jedes Seitenaufrufs in Eingabeverzögerung (Warten auf den Hauptthread), Verarbeitung (Ausführen der Event-Handler) und Darstellung (Zeichnen des nächsten Frames). Langsamste Interaktionen listet die Elemente, die Besucher angeklickt, angetippt oder in die sie geschrieben haben, mit dem Ereignis. Skripte, die während der langsamsten Interaktion liefen listet das Skript, das dabei am längsten lief, nach Adresse, mit dem Auslöser (Gestartet durch, zum Beispiel event-listener). Nur Chrome und Edge melden Skripte.
Was sich verschiebt
Was sich verschiebt listet das Element, das sich in der größten Folge von Layout-Verschiebungen eines Seitenaufrufs am stärksten bewegt hat, mit seinem CLS.
Jede dieser Tabellen führt pro Website und Tag bis zu 100 verschiedene Elemente, Bilder oder Skripte. Der Rest wird als (andere Elemente), (andere Bilder) oder (andere Skripte) gezählt.
Aufschlüsselungen
Aufschlüsselungen zeigt Aufrufe und p75 für LCP, INP, CLS und TTFB nach:
- Land: aus der IP-Adresse des Besuchers, beim Eintreffen des Seitenaufrufs ermittelt und nicht gespeichert. Bis zu 60 Länder pro Website und Tag, der Rest unter Andere Länder. Die Länder stammen aus GeoLite2-Daten von MaxMind.
- Browser: Chrome, Edge, Safari, Firefox, Samsung Internet, Opera oder Andere Browser.
- Verbindung: der effektive Verbindungstyp, den der Browser meldet (4g, 3g, 2g, slow-2g). Nur Chrome, Edge und andere Chromium-Browser melden ihn, Besuche mit Safari und Firefox erscheinen daher als Nicht gemeldet.
- Navigation: Normaler Aufruf, Neu geladen, Zurück oder vor, Back/Forward-Cache (eine sofort wiederhergestellte Seite) und Vorab gerendert.
Alarme
Wählen Sie unter Alarme auf der Seite einer Website eine Metrik, geben Sie nach p75 über einen Schwellenwert ein, wählen Sie unter Benachrichtigen die Alarmkanäle und klicken Sie auf Alarm hinzufügen. Pro Website sind bis zu 5 Alarme möglich. Jeder wird stündlich gegen heute und gestern (UTC) geprüft, sobald mindestens 30 Seitenaufrufe gemessen sind. Sie erhalten eine Nachricht, wenn der p75 über den Schwellenwert steigt, und eine, wenn er wieder darunter liegt. Alarme gehen an die Alarmkanäle Ihres Teams.
Deploy-Markierungen
Um Ihre Releases im Tagesdiagramm zu sehen, senden Sie eine Markierung mit dem Website-Schlüssel (dem Wert von data-site im Snippet) als configId:
curl -X POST "https://speed.loadfocus.com/api/test/applighthouse/annotations" \-H "loadfocus-auth: YOUR_API_KEY" -H "content-type: application/json" \-d '{"label":"Deployed v1.4.2","configId":"YOUR_SITE_KEY"}'
Markierungen ohne configId erscheinen bei jeder Website und jedem Monitor. Mehr dazu unter CI-Build-Gating & Deploy-Markierungen.
Grenzen
| Plan | Websites | Seitenaufrufe pro Monat |
|---|---|---|
| Kostenlos | 1 | 10.000 |
| Kostenpflichtig | 20 | 1.000.000 |
Seitenaufrufe werden pro Team gezählt. Die Seite zeigt, wie viele Sie in diesem Monat verbraucht haben. Ist die Grenze erreicht, werden neue Seitenaufrufe bis zum nächsten Monat nicht gezählt.
Um Name oder Hostnamen einer Website zu ändern, verwenden Sie Website bearbeiten. Website löschen entfernt die Website mit allen Daten.