Real User Monitoring (RUM): measuring actual user-experienced performance

Lab performance tests and Lighthouse scores look good, but real users report the application is slow. Synthetic tests run on fast machines with fast connections — they miss real-world variability across devices, networks, and geographies.

Implement Real User Monitoring to collect Core Web Vitals and custom timing from actual user browsers.

Using web-vitals library:

import { onCLS, onFID, onLCP, onTTFB, onFCP } from 'web-vitals';

function sendToAnalytics({ name, value, id, rating }) {
  // Send to your analytics endpoint or Sentry Performance
  fetch('/api/vitals', {
    method: 'POST',
    body: JSON.stringify({ name, value, id, rating, url: location.href }),
    keepalive: true, // ensures delivery even on page unload
  });
}

onCLS(sendToAnalytics);
onFID(sendToAnalytics);
onLCP(sendToAnalytics);
onTTFB(sendToAnalytics);
onFCP(sendToAnalytics);

Core Web Vitals targets (Google thresholds):

• LCP (Largest Contentful Paint) < 2.5s — loading
• FID/INP (Interaction to Next Paint) < 200ms — interactivity
• CLS (Cumulative Layout Shift) < 0.1 — visual stability

Segment RUM data by country, device type, and connection speed to find real bottlenecks.

RUM captures the 75th percentile of real users' experiences. A page that loads in 1s for 80% of users but 8s for 20% of users (slow mobile connections) will show median=1s in lab tests but reveal the real P75=4s with RUM.

Measuring real user performance for a customer-facing web application