# Das Dashboard verwenden

Das smoxy RUM Dashboard bietet Echtzeit-Einblicke in die Leistung der Website aus der Perspektive tatsächlicher Benutzer. Diese Anleitung hilft beim Navigieren und Verstehen des Dashboards.

### Zugriff auf das Dashboard

1. Im smoxy Hub anmelden
2. Zu **Real User Monitoring** navigieren

### Dashboard-Übersicht

Das RUM-Dashboard ist in mehrere Hauptbereiche unterteilt:

#### 1. Core Web Vitals Widget

![Core Web Vitals-Übersicht mit LCP, INP und CLS](https://docs.smoxy.eu/~gitbook/image?url=https%3A%2F%2F3000458937-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FNMHyPzupwEpnnrhQdgfe%252Fuploads%252Frxy5SbCSZcBmwUANdHXr%252FBildschirmfoto%25202025-11-10%2520um%252017.55.26.png%3Falt%3Dmedia%26token%3D8449e7e3-88be-45a5-a857-b58e4c6900e4\&width=768\&dpr=4\&quality=100\&sign=838ae01a\&sv=2)

**Position**: Oben im Dashboard

**Was es zeigt**:

* Aktuelle 75. Perzentilwerte für LCP, INP und CLS
* Klassifizierung (Gut/Verbesserungsbedarf/Schlecht) für jede Metrik

**Wie verwenden**:

* Schneller Gesundheitscheck der Website-Leistung
* Identifizieren, welche Core Web Vitals Aufmerksamkeit benötigen
* Tägliche Veränderungen überwachen

{% hint style="success" %}
**Ziel**: Alle drei Metriken im "Gut" (grünen) Bereich halten für optimales SEO und Benutzererfahrung.
{% endhint %}

#### 2. Performance-Trend-Diagramm

**Was es zeigt**:

* Zeitreihen-Visualisierung des gesamten Core Web Vitals-Status
* Ob die Website "Gut", "Verbesserungsbedarf" oder "Schlecht" über die Zeit abschneidet
* Historische Leistungstrends zur Identifizierung von Mustern

**Wie verwenden**:

1. Zeitbereich auswählen (Letzte 24 Stunden, 7 Tage, 30 Tage, benutzerdefiniert)
2. Trend des gesamten Leistungsstatus ansehen
3. Identifizieren, wann sich die Leistung von einem Status zu einem anderen geändert hat

**Häufige Muster, nach denen gesucht werden sollte**:

* **Statusänderungen**: Wann hat sich die Leistung von "Gut" zu "Verbesserungsbedarf" verschlechtert?
* **Tageszeitliche Muster**: Verschlechtert sich die Leistung während Spitzenverkehrszeiten?
* **Deployment-Korrelation**: Hat ein kürzliches Deployment den Leistungsstatus verändert?
* **Wochentag-Muster**: Bessere Leistung am Wochenende vs. unter der Woche?

{% hint style="info" %}
**Profi-Tipp**: Dieses Diagramm nutzen, um Leistungsänderungen mit Deployments, Traffic-Spitzen oder Konfigurationsänderungen zu korrelieren. Eine plötzliche Statusänderung deutet oft darauf hin, dass etwas Spezifisches zu dieser Zeit passiert ist.
{% endhint %}

#### 3. Geografische Leistungskarte

**Was sie zeigt**:

* Weltkarte, farbcodiert nach Leistung
* Aggregierung auf Länderebene
* Gesamter Core Web Vitals-Status pro Region

**Farbcodierung**:

* 🟢 **Grün**: Alle Core Web Vitals sind "Gut"
* 🟡 **Gelb**: Einige Metriken "Benötigen Verbesserung"
* 🔴 **Rot**: Eine oder mehrere Metriken sind "Schlecht"
* ⚪ **Grau**: Keine Daten oder unzureichende Daten

**Wie verwenden**:

1. Geografische Regionen mit schlechter Leistung identifizieren
2. Auf ein Land klicken, um detaillierte Metriken zu sehen
3. Leistung über Regionen vergleichen

**Häufige Erkenntnisse**:

* Entfernte Regionen benötigen möglicherweise regionale CDN-Optimierung
* Bestimmte Länder mit konsistent schlechter Leistung können auf ISP-Probleme hindeuten
* Prüfen, ob Zielmärkte gute Leistung haben

**Handlungsschritte**:

* Wenn wichtige Märkte schlechte Leistung zeigen, erwägen:
  * Regionale CDN-Konfiguration
  * Lokale Server-Präsenz
  * Netzwerk-Routen-Optimierung

#### 4. Per-URL-Leistungstabelle

![](https://docs.smoxy.eu/~gitbook/image?url=https%3A%2F%2F3000458937-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FNMHyPzupwEpnnrhQdgfe%252Fuploads%252Fuc41sqffzyV5hlLHjTSa%252FBildschirmfoto%25202025-11-10%2520um%252018.01.09.png%3Falt%3Dmedia%26token%3Dc2613ab2-0e97-411e-8195-a0da1c7cb01b\&width=768\&dpr=4\&quality=100\&sign=72d28c4b\&sv=2)

**Was sie zeigt**:

* Leistungsmetriken aufgeschlüsselt nach einzelnen URLs
* Event-Count (Anzahl der verfolgten Seitenaufrufe)
* Alle Core Web Vitals und Timing-Metriken pro Seite

**Spalten**:

* URL/Seitenpfad
* Views (Event-Count)
* LCP, INP, CLS
* Core Web Vitals-Bewertung

**Wie verwenden**:

1. Nach beliebiger Spalte sortieren, um Ausreißer zu finden
2. Seiten mit schlechter Leistung identifizieren

**Sortierstrategien**:

📊 **Nach Views sortieren** → Fokus auf hochfrequentierte Seiten zuerst\
🐌 **Nach LCP sortieren** → Seiten mit Ladeproblemen finden\
⚡ **Nach INP sortieren** → Nicht reagierende Seiten finden

{% hint style="warning" %}
**Wichtig**: Fokus zuerst auf Seiten mit signifikantem Traffic. Eine langsame Seite mit 10 Views/Monat hat weniger Einfluss als eine mäßig langsame Seite mit 10.000 Views/Monat. 
{% endhint %}

### Häufige Dashboard-Workflows

#### 1. Täglicher Leistungscheck

**Ziel**: Schneller Gesundheitscheck der Website-Leistung

1. Dashboard öffnen
2. Core Web Vitals Widget prüfen - alles grün?
3. Trend-Diagramm auf besorgniserregende Spitzen prüfen
4. Top 5 Seiten nach Traffic prüfen - neue Probleme?
5. Dauert 2-3 Minuten

#### 2. Post-Deployment-Validierung

**Ziel**: Überprüfen, dass Deployment die Leistung nicht beeinträchtigt hat

1. Deployment-Zeit notieren
2. Benutzerdefinierten Zeitbereich einstellen: 24 Stunden vorher → 24 Stunden nachher
3. Trend-Diagramm auf Änderungen zur Deployment-Zeit prüfen
4. Core Web Vitals überprüfen: Haben sich Metriken verschlechtert?
5. Per-URL-Tabelle auf betroffene Seiten prüfen
6. Bei Leistungsverschlechterung untersuchen und ggf. zurückrollen

#### 3. Optimierungspriorisierung

**Ziel**: Identifizieren, was für maximalen Einfluss optimiert werden soll

1. Zeitbereich auf "Letzte 30 Tage" für stabile Daten einstellen
2. Per-URL-Tabelle nach "Views" absteigend sortieren
3. Auf Top 20 Seiten nach Traffic filtern
4. Nach LCP sortieren, um langsamste hochfrequentierte Seiten zu finden
5. Dies sind die Optimierungsprioritäten
6. Tickets/Aufgaben für Top 5 Seiten erstellen

#### 4. Geografische Leistungsanalyse

**Ziel**: Gute Leistung in Zielmärkten sicherstellen

1. Geografische Karte öffnen
2. Rote/gelbe Regionen identifizieren
3. Auf wichtige Marktländer klicken
4. Detaillierte Metriken überprüfen
5. TTFB über Regionen vergleichen (zeigt CDN-Effektivität)
6. Wenn wichtige Märkte langsam sind, untersuchen:
   * CDN-Abdeckung in dieser Region
   * Netzwerk-Routing
   * Regionale ISP-Probleme

### Best Practices

#### Regelmäßiges Monitoring

✅ **Täglich**: Schneller Core Web Vitals-Check (2 Minuten)\
✅ **Wöchentlich**: Trend-Diagramm und Top-Seiten überprüfen (10 Minuten)\
✅ **Monatlich**: Umfassende Leistungsüberprüfung und Optimierungsplanung (30 Minuten)\
✅ **Post-Deployment**: Immer innerhalb von 24 Stunden nach jeder Änderung prüfen

#### Leistungsziele setzen

**Minimalziele** (für SEO und grundlegende UX):

* LCP < 2,5s
* INP < 200ms
* CLS < 0,1
* Alle Metriken im "Gut"-Bereich

**Ambitionierte Ziele** (für exzellente UX):

* LCP < 1,5s
* INP < 100ms
* CLS < 0,05
* Seitenladezeit < 2s

#### Optimierungs-Workflow

1. **Messen**: Dashboard nutzen, um Probleme zu identifizieren
2. **Priorisieren**: Fokus auf hochfrequentierte Seiten mit schlechten Metriken
3. **Optimieren**: Gezielte Verbesserungen vornehmen
4. **Validieren**: Dashboard nutzen, um Verbesserungen zu bestätigen
5. **Iterieren**: Zyklus mit nächster Priorität fortsetzen

### Erweiterte Analysen benötigt?

Das smoxy RUM-Dashboard bietet umfassende Einblicke für die meisten Anwendungsfälle. Wenn jedoch benötigt wird:

* Benutzerdefinierte Metrikberechnungen
* Erweiterte Segmentierung
* Integration mit bestehenden Monitoring-Tools
* Benutzerdefinierte Alarmregeln
* Langfristige Trendanalyse über das Dashboard hinaus

Das Open-Source-Grafana-Dashboard-Projekt erkunden:

👉 [Benutzerdefinierte Dashboards mit Grafana](https://docs.smoxy.eu/real-user-monitoring/benutzerdefinierte-dashboards-mit-grafana)

Dies ermöglicht vollständig angepasste Visualisierungen mit RUM-Daten via API, während smoxy weiterhin die Daten sammelt und speichert.