Web Vitals

FastStats collects Core Web Vitals directly from real user browsers and stores them as analytics events. You can use this data to monitor page quality over time, segment by route/device/browser, and detect regressions after releases.

What FastStats Tracks

• Core Web Vitals: LCP, CLS, INP
• Additional metrics: FCP, TTFB
• Dimensions: URL, browser, OS, country, device
• Optional attribution: extra details to debug where a metric came from

Setup

1. Enable Web Vitals in your project settings.
2. Initialize the Web SDK with webVitals: true.
3. Optionally enable webVitalsAttribution when debugging specific issues.

import { initFastStats } from "@faststats/web";

initFastStats({
	projectId: "your-project-id",
	webVitals: true,
	webVitalsAttribution: false,
	cookieless: true,
});

Script Tag Setup

<script
	defer
	data-project-id="your-project-id"
	data-web-vitals="true"
	data-cookieless="true"
	src="https://cdn.faststats.dev/tracker.js"
></script>

References

Metric definitions and optimization guidance are maintained by web.dev:

• Largest Contentful Paint (LCP)
• Cumulative Layout Shift (CLS)
• Interaction to Next Paint (INP)
• First Contentful Paint (FCP)
• Time to First Byte (TTFB)

Use FastStats to monitor real-user measurements. Use web.dev for metric theory and optimization techniques.