Dokumentation

Live-Daten Dashboard

CWV-Bewertung, Trendchart, Heatmap, langsamste Seiten, Live-Widget, Browser-, Referrer- und Verbindungsanalyse.

Übersicht

Das Dashboard zeigt die Performance deiner Website aus Sicht echter Besucher — zusammengefasst, visualisiert und aufgeschlüsselt.

Core Web Vitals Bewertung

Oben im Dashboard zeigt ein Banner, ob deine Website die Core Web Vitals besteht:

  • Bestanden — alle drei Signale (LCP, CLS, INP) liegen im grünen Bereich
  • Nicht bestanden — mindestens eine Metrik überschreitet den Google-Schwellwert
  • Zu wenig Daten — noch nicht genug Messungen für eine zuverlässige Bewertung (min. 20 pro Metrik)

Metrikkarten

Fünf Karten zeigen die aktuellen p75-Werte für LCP, CLS, INP, FCP und TTFB. Jede Karte enthält:

  • den p75-Wert
  • eine Bewertung (Gut / Verbesserungswürdig / Schlecht)
  • die Anzahl der Messungen
  • einen Trendpfeil im Vergleich zum Vortag

Trendchart

Der Chart zeigt den p75-Verlauf pro Tag. Du kannst steuern:

  • Zeitraum: 7, 30 oder 90 Tage
  • Metrik: Alle (LCP, FCP, TTFB, INP überlagert) oder einzeln
  • Gerät: Alle, Desktop, Mobile oder Tablet
  • Vorperiode: optionaler Vergleich mit dem vorherigen Zeitraum (gestrichelte Linie)

Scan-Marker (violette Dreiecke) zeigen Tage, an denen ein geplanter Scan stattfand. Ein Klick öffnet den Scan-Report.

Langsamste Seiten

Die Tabelle zeigt die Seiten mit dem höchsten p75-LCP-Wert — dynamisch geladen mit serverseitiger Paginierung (15 Einträge pro Seite).

Spalten:

  • Pfad
  • p75 LCP
  • LCP-Element (z. B. <img>, <h1>)
  • p75 FCP
  • p75 TTFB
  • Anzahl Messungen

Funktionen:

  • Sortiert nach p75-LCP absteigend
  • Suchfeld mit Debounce — Eingabe filtert nach Pfad
  • Paginierung mit Zurück/Weiter-Buttons
  • Klick auf eine Zeile klappt einen 14-Tage-LCP-Verlaufschart inline auf (Balkendiagramm-Icon neben dem Pfad zeigt die Erweiterbarkeit an)
  • Der Verlaufschart zeigt: 7-Tage-Durchschnitt, 14-Tage-Trend in Prozent, durchschnittliche Messungen pro Tag
  • CSV-Export — Button mit Auswahl zwischen 24h- und 7d-Zeitraum; der aktive Suchfilter wird auf den Export angewendet

Performance-Heatmap

Unterhalb des Charts zeigt eine Heatmap Performance-Muster nach Wochentag (Mo–So) und Tageszeit (vier Blöcke: 0–6 Uhr, 6–12 Uhr, 12–18 Uhr, 18–24 Uhr).

Die Farbcodierung basiert auf dem p75-Wert:

  • Grün — Gut (innerhalb der Google-Empfehlung)
  • Gelb — Verbesserungswürdig
  • Rot — Schlecht

Umschaltbar zwischen den Metriken LCP, FCP und TTFB sowie den Zeiträumen 7 Tage und 30 Tage. Die Heatmap hilft dabei, wiederkehrende Muster zu erkennen — etwa Performance-Einbrüche zu Stoßzeiten oder während nächtlicher Batch-Jobs.

Verbindungsqualität

Eine Aufschlüsselung der LCP-Performance nach Verbindungsqualität:

  • Schnell — z. B. 4G, schnelles WLAN
  • Mittel — z. B. 3G, langsames WLAN
  • Langsam — z. B. 2G, hohe Latenz

Die Klassifizierung basiert auf Verbindungstyp und Round-Trip-Time (RTT). Pro Gruppe werden der p75-LCP-Wert und die Anzahl der Messungen angezeigt.

Browser-Analyse

Die sechs häufigsten Browser nach Messungen, jeweils mit:

  • p75 LCP und Bewertung
  • p75 INP und Bewertung

Hilft bei der Identifikation browserspezifischer Probleme — etwa auffällig hohe INP-Werte in Safari oder langsamer LCP in älteren Chrome-Versionen.

Referrer-Analyse

Ein Tab Top Referrer neben „Langsamste Seiten" zeigt die zehn stärksten Traffic-Quellen nach Seitenaufrufen:

  • Direkt / Keine Angabe — kein Referrer vorhanden
  • Intern — Aufrufe von der eigenen Domain
  • Externe Domain — z. B. google.de, twitter.com

Dedupliziert pro page_id, damit wiederholte Aufrufe desselben Besuchers nicht mehrfach zählen.

Nach Gerät

Drei Karten zeigen Desktop, Mobile und Tablet mit jeweils:

  • Anzahl Messungen (letzte 24 Stunden)
  • p75-LCP-Wert
  • Bewertung (Gut / Mittel / Schlecht)

Nach Land

Eine Tabelle zeigt die Herkunftsländer deiner Besucher mit p75-LCP und Anzahl Messungen. Nützlich um zu erkennen, ob internationale Besucher deutlich schlechtere Werte haben.

Live-Widget

Ein Echtzeit-Widget oben rechts im Dashboard zeigt:

  • Aktuelle p75-Werte für alle fünf Metriken (basierend auf den letzten 60 Minuten)
  • Letzte Ereignisse — Tabelle mit Pfad, LCP, Gerät, Land und Zeitpunkt
  • Seitenaufrufe — Zähler der erfassten Pageviews

Das Widget aktualisiert sich automatisch alle 30 Sekunden. Wenn der Browser-Tab im Hintergrund ist, pausiert die Aktualisierung.

LCP-Element & INP-Selector

Das Dashboard zeigt das häufigste LCP-Element (z. B. <img>, <h1>, <video>) und den häufigsten langsamen INP-Selector. Diese Angaben helfen dabei, gezielt die Elemente zu identifizieren, die Performance-Probleme verursachen — etwa ein zu großes Hero-Bild oder ein schwerfälliger Event-Handler.

DSGVO-Hinweis

Auf der Website-Übersicht und in der Einbindungscode-Karte steht ein vorgefertigter Datenschutzhinweis zur Verfügung, der per Klick kopiert werden kann.

Der vorgeschlagene Text umfasst:

  • Welche Daten erhoben werden (anonymisierte Performance-Metriken)
  • Dass keine Cookies gesetzt werden
  • Dass keine personenbezogenen Daten gespeichert werden
  • Die Rechtsgrundlage: Art. 6 Abs. 1 lit. f DSGVO (berechtigtes Interesse an der technischen Optimierung)

Der Text kann direkt in die eigene Datenschutzerklärung übernommen und bei Bedarf angepasst werden.

Weiterlesen