Setting Up Real User Monitoring

This guide will walk you through enabling Real User Monitoring for your domains in smoxy.

Prerequisites

Before you begin, ensure you have:

✅ Owner or Maintainer role in your smoxy account
✅ Ability to add a JavaScript snippet to your website's HTML

Real User Monitoring can be enabled for up to 10 domains per configuration. If you need to monitor more domains, contact support.

Step 1: Access RUM Configuration

Log in to the smoxy Hub
Click on Real User Monitoring
Click the RUM Settings button

Step 2: Configure Your Domains

Add Domains to Monitor

In the RUM configuration panel:

Add Domains: Enter up to 10 domains you want to monitor
- You can add any domain - they don't need to be configured in smoxy
- This allows you to monitor domains even if you're only using RUM (not other smoxy features)
- Simply type the domain name and add it to your list

Example Configuration

Added Domains:
- www.example.com
- shop.example.com
- blog.example.com

Click Save

After saving, smoxy will generate:

A unique RUM Token (format: srt-xxxxxxxxxxxxxxxxxxxxxxxxxxxxx)
A JavaScript snippet for your website

Step 3: Install the Tracking Snippet

Copy Your Snippet

After configuration, you'll see a JavaScript snippet similar to this:

<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>

Add to Your Website

Place the snippet just before the closing </head> tag of your website's HTML template.

Best Practice: Add the snippet to your website's global header template so it's automatically included on all pages.

Implementation Examples

WordPress: Add to your theme's header.php before </head>, or use a plugin like "Insert Headers and Footers" to add the snippet to the header section.

Shopify: Go to Online Store → Themes → Actions → Edit code, open theme.liquid, and paste the snippet before </head>.

Next.js / React: Use the next/script component with strategy="afterInteractive" in your root layout or _app file.

HTML / Static Sites: Simply paste the snippet in your HTML template's <head> section, just before the closing </head> tag.

Step 4: Verify Installation

Check Data Collection

After installing the snippet:

Visit your website in a browser
Open Developer Tools (F12)
Go to the Network tab
Look for requests to rum.smoxy.eu/_sx/a
You should see:
- A request to perf.gif (tracking pixel)
- A request to core.js (RUM script)
- POST requests to /_sx/a (data being sent)

If you see these requests, RUM is working correctly! Data will appear in your dashboard within a few minutes.

Dashboard Verification

Navigate to Real User Monitoring in the smoxy Hub
Click View Analytics or Dashboard
Wait 2-5 minutes for initial data to appear
You should see data starting to populate in the widgets

No data showing?

Verify the snippet is on all pages
Check that your domain matches the configured domains exactly
Clear your browser cache and reload the page
Check browser console for any JavaScript errors

Step 5: Understanding Your Configuration

RUM Token

Your RUM token (srt-xxxxx...) is unique to your account and is used to:

Authenticate data submissions
Associate data with your organization
Validate incoming requests

Keep your token secure! While the token is not sensitive like a password, treat it as you would any API key. Don't commit it to public repositories.

Domain Validation

smoxy validates every RUM data submission:

The domain field must match one of your configured domains
Subdomains are matched exactly (e.g., www.example.com ≠ example.com)
Invalid domains are automatically rejected

Troubleshooting

Common Issues

Problem: Data not appearing after 10+ minutes Solution:

Verify domain in snippet matches configured domains exactly
Visit the site multiple times to trigger sampling

Problem: RUM slowing down page load Solution: This should not happen as RUM uses requestIdleCallback. Check:

No JavaScript errors blocking execution
Snippet is in <head>, not <body>
You're using the latest snippet version

Problem: Seeing duplicate data Solution: Ensure snippet is only included once on each page

What's Next?

Now that RUM is collecting data, learn how to use it:

Understanding Your Metrics - Deep dive into each performance metric
Using the Analytics Dashboard - Navigate the smoxy RUM dashboard
Custom Dashboards with Grafana - Build your own visualizations

Pro Tip: Give RUM 24-48 hours to collect sufficient data before making major optimization decisions. This ensures you have statistically significant insights.

Last updated 27 days ago

Was this helpful?