Performance and Web Vitals

Page loads, slow requests and Core Web Vitals from real visitors.

What is measured

In the browser, with the default settings, the SDK measures:

Page loads, from the browser’s navigation timing.
Resources: how long each script, stylesheet, image and request took to load, and its transfer size.
Core Web Vitals: LCP, CLS and INP, each rated.
Network requests made with fetch or XMLHttpRequest: method, URL, status and duration.

These come from autoCapture.performance and autoCapture.networkRequests, both on by default. Nothing is measured in Node.js. The SDK’s own uploads to Apperio are left out.

Core Web Vitals

Metric	What it measures	Good	Needs improvement	Poor
LCP	When the largest piece of content appeared	2.5 s or less	up to 4 s	over 4 s
CLS	How much the layout jumped around	0.1 or less	up to 0.25	over 0.25
INP	How long the page took to respond to a click, tap or key	200 ms or less	up to 500 ms	over 500 ms

Each reading is sent with its rating (good, needs-improvement or poor). For INP, the SDK reports each interaction that took 40 ms or longer.

What is sent by default

Each measurement is logged at a level that depends on how slow it was, and the SDK only sends logs at or above its minLogLevel, which is info by default. So out of the box, fast results stay in the browser and only the slow ones reach Apperio:

Measurement	Sent by default when
Page load	over 1 s (over 3 s is a warning)
Script or stylesheet	over 1 s
Any other resource	over 3 s
LCP	over 2.5 s
CLS	over 0.1
INP	over 200 ms
Network request	status 4xx or 5xx, a failure, or slower than 5 s

Why the Web Vitals page can look worse than reality

With the default level, good readings are never sent, so charts built from them show only the slower visits. Keep that in mind when you read the averages.

Sending every measurement

Lower the level to debug to send fast results as well:

TypeScript

import { Apperio, LogLevel } from 'apperio';

const logger = new Apperio({
  apiKey: 'your-api-key',
  projectId: 'your-project-id',
  environment: 'production',
  minLogLevel: LogLevel.DEBUG,
});

This sends a lot more: every successful request and every resource on every page. It also lets your own logger.debug() calls through. Consider it for a while on a quiet site, or a staging environment, rather than permanently.

Where you see it

Core Web Vitals: LCP, INP and CLS.
Performance Analytics: response times and throughput.
Network Monitoring: requests, statuses and timings.
Pageview Analytics: page traffic.

Deploys appear as markers on the Performance Analytics chart, so you can see whether a release made things slower. See Deploys and verdicts.