Web Vitals

Add the Web Vitals extension to report LCP, CLS, INP, FCP, and TTFB from visitor sessions.

Enable Web Vitals

Import the extension from its package subpath. Pass an options object only when you need attribution data.

import { webVitals } from "@faststats/react/web-vitals";

<Analytics siteKey="your_site_key" extensions={[webVitals()]} />;

faststats: {
	siteKey: "your_site_key",
	extensions: { webVitals: true },
}

import { init } from "@faststats/web";
import { webVitals } from "@faststats/web/web-vitals";

init({
	siteKey: "your_site_key",
	extensions: [webVitals()],
});

Collected Metrics

The tracker reports the standard set of Core Web Vitals.

Each metric is sent with its value, an id, a rating and the navigation type. Metrics are flushed when the page is hidden and when the route changes in a single page app.

Attribution

Turn on attribution to include extra debugging data that points to the element or event responsible for a metric. This payload is larger, so leave it off unless you are chasing a specific issue.

webVitals({ attribution: true });

In Nuxt, use extensions: { webVitals: { attribution: true } }.