Real User Monitoring einrichten

Diese Anleitung führt dich durch die Aktivierung von Real User Monitoring für deine Domains in smoxy.

Voraussetzungen

Vor dem Start sicherstellen, dass:

✅ Die Rolle Owner oder Maintainer im smoxy-Konto vorhanden ist ✅ Die Möglichkeit besteht, ein JavaScript-Snippet zum HTML der Website hinzuzufügen

Schritt 1: Auf RUM-Konfiguration zugreifen

  1. Im smoxy Hub anmelden

  2. Auf Real User Monitoring klicken

  3. Auf die Schaltfläche RUM-Einstellungen klicken

Schritt 2: Domains konfigurieren

Domains zum Monitoring hinzufügen

Im RUM-Konfigurationspanel:

  1. Domains hinzufügen: Bis zu 10 Domains eingeben, die überwacht werden sollen

    • Jede Domain kann hinzugefügt werden - sie müssen nicht in smoxy konfiguriert sein

    • Dies ermöglicht das Monitoring von Domains, auch wenn nur RUM verwendet wird (nicht andere smoxy-Funktionen)

    • Einfach den Domainnamen eingeben und zur Liste hinzufügen

Beispielkonfiguration

Hinzugefügte Domains:
- www.example.com
- shop.example.com
- blog.example.com

  1. Auf Speichern klicken

Nach dem Speichern generiert smoxy:

  • Ein einzigartiges RUM-Token (Format: srt-xxxxxxxxxxxxxxxxxxxxxxxxxxxxx)

  • Ein JavaScript-Snippet für die Website

Schritt 3: Das Tracking-Snippet installieren

Snippet kopieren

Nach der Konfiguration erscheint ein JavaScript-Snippet ähnlich diesem:

<script>
(function() {
    var tok = 'srt-xxxxxxxxxxxxxxxxxxxxxxxxxxxxx'; // Token unique to each customer
    var org = 123;
    var img = 'https://svc.smoxy.eu/_sx/a/perf.gif'; // Path to the tracking pixel
    var url = 'https://svc.smoxy.eu/_sx/a/core.js'; // Path to the core script
    
    // Function to load the core script
    function loadCore() {
        var scr = document.createElement('script'); // Create a script element
        scr.src = url + '?token=' + encodeURIComponent(tok); // Append query params
        scr.async = true; // Ensure the script loads asynchronously
        scr.defer = true; // Defer loading until HTML parsing is complete
        scr.onload = function() {
            // Once the core script is loaded, call the initialization function
            if (typeof window.initM === 'function') {
                    window.initM(tok, org); // Pass token and org
            }
        };
        document.head.appendChild(scr); // Attach the script to the document head
    }
    
    // Function to load the tracking pixel
    function loadImage() {
        var pix = new Image(); // Create a new image element
        pix.onload = loadCore; // On successful load of the pixel, load the core script
        pix.onerror = function() {
            loadCore();
        };
        pix.src = img;
    }
    
    // Use requestIdleCallback if available, otherwise fallback to setTimeout
    if ('requestIdleCallback' in window) {
        requestIdleCallback(loadImage, { timeout: 5000 }); // Use requestIdleCallback with a timeout of 5 seconds
    } else {
        setTimeout(loadImage, 1); // Fallback: load the image immediately
    }
})();
</script>

Zur Website hinzufügen

Das Snippet direkt vor dem schließenden </head>-Tag der HTML-Vorlage der Website platzieren.

Implementierungsbeispiele

WordPress: Zur header.php des Themes vor </head> hinzufügen, oder ein Plugin wie "Insert Headers and Footers" verwenden, um das Snippet zum Header-Bereich hinzuzufügen.

Shopify: Zu Online Store → Themes → Actions → Edit code gehen, theme.liquid öffnen und das Snippet vor </head> einfügen.

Next.js / React: Die next/script-Komponente mit strategy="afterInteractive" im Root-Layout oder in der _app-Datei verwenden.

HTML / Statische Seiten: Das Snippet einfach im <head>-Bereich der HTML-Vorlage einfügen, direkt vor dem schließenden </head>-Tag.

Schritt 4: Installation überprüfen

Datensammlung prüfen

Nach der Installation des Snippets:

  1. Die Website in einem Browser besuchen

  2. Entwicklertools öffnen (F12)

  3. Zum Tab Network gehen

  4. Nach Anfragen an rum.smoxy.eu/_sx/a suchen

  5. Folgendes sollte sichtbar sein:

    • Eine Anfrage an perf.gif (Tracking-Pixel)

    • Eine Anfrage an core.js (RUM-Skript)

    • POST-Anfragen an /_sx/a (Daten werden gesendet)

Wenn diese Anfragen sichtbar sind, funktioniert RUM korrekt! Daten werden innerhalb weniger Minuten im Dashboard angezeigt.

Dashboard-Verifizierung

  1. Zu Real User Monitoring im smoxy Hub navigieren

  2. Auf Analysen anzeigen oder Dashboard klicken

  3. 2-5 Minuten warten, bis die ersten Daten erscheinen

  4. Daten sollten in den Widgets angezeigt werden

Keine Daten angezeigt?

  • Überprüfen, dass das Snippet auf allen Seiten vorhanden ist

  • Prüfen, dass die Domain genau mit den konfigurierten Domains übereinstimmt

  • Browser-Cache leeren und die Seite neu laden

  • Browser-Konsole auf JavaScript-Fehler prüfen

Schritt 5: Konfiguration verstehen

RUM-Token

Das RUM-Token (srt-xxxxx...) ist eindeutig für das Konto und wird verwendet für:

  • Authentifizierung von Datenübermittlungen

  • Zuordnung von Daten zur Organisation

  • Validierung eingehender Anfragen

Token sicher aufbewahren! Obwohl das Token nicht so sensibel wie ein Passwort ist, sollte es wie ein API-Schlüssel behandelt werden. Nicht in öffentliche Repositories committen.

Domain-Validierung

smoxy validiert jede RUM-Datenübermittlung:

  • Das Feld domain muss mit einer der konfigurierten Domains übereinstimmen

  • Subdomains werden exakt abgeglichen (z. B. www.example.com ≠ example.com)

  • Ungültige Domains werden automatisch abgelehnt

Fehlerbehebung

Häufige Probleme

Problem: Daten erscheinen nicht nach 10+ Minuten Lösung:

  • Überprüfen, dass die Domain im Snippet genau mit den konfigurierten Domains übereinstimmt

  • Die Website mehrmals besuchen, um das Sampling auszulösen

Problem: RUM verlangsamt das Laden der Seite Lösung: Dies sollte nicht passieren, da RUM requestIdleCallback verwendet. Prüfen:

  • Keine JavaScript-Fehler, die die Ausführung blockieren

  • Snippet ist im <head>, nicht im <body>

  • Die neueste Snippet-Version wird verwendet

Problem: Duplizierte Daten werden angezeigt Lösung: Sicherstellen, dass das Snippet nur einmal auf jeder Seite enthalten ist

Was kommt als Nächstes?

Jetzt, wo RUM Daten sammelt, lernen, wie diese genutzt werden:

Profi-Tipp: RUM 24-48 Stunden Zeit geben, um ausreichend Daten zu sammeln, bevor größere Optimierungsentscheidungen getroffen werden. Dies stellt sicher, dass statistisch signifikante Erkenntnisse vorliegen.

Last updated

Was this helpful?