Analytics

Vercel Speed Insights

Configure Vercel Speed Insights

Enable Speed Insights for the project in Vercel. Remove the SpeedInsights component or injectSpeedInsights() call from @vercel/speed-insights. The collector starts once per page, so a copy loaded outside c15t keeps reporting before consent.

npm install @c15t/integrations@alpha

src/consent-scripts.ts

import { vercelSpeedInsights } from '@c15t/integrations/vercel-speed-insights';

export const scripts = [vercelSpeedInsights()];

Register the scripts

Complete your framework quickstart first. Keep its Inth endpoint, policy, styles and consent UI. Remove the vendor's original script, SDK initializer or tag-manager entry, so the vendor loads only through c15t.

The vendor pages put the helper in src/consent-scripts.ts. If your framework quickstart already has a scripts array, such as the one in c15t.config.ts in the Next.js guide, add the helper to that array instead of creating a second file. The scripts export is a configuration, not an initializer. Add it to the c15t provider you already have, at the registration point for your framework below. These are edits to that provider, not a second provider.

Add the configuration to scripts in c15t.config.ts, next to next.config.ts:

import { defineConsentConfig } from 'c15t/next';
import { scripts } from './src/consent-scripts';

export default defineConsentConfig({ scripts });

Keep the rest of your config, such as mode and routePrefix, in the same call. ConsentRoot reads the config in the browser, so the layout keeps passing only state. App Router, Pages Router and static export all read the same file. See Next.js scripts and embeds.

Options

Option	Default	Behavior
`dsn`	None	Project DSN for deployments outside Vercel, set as `data-dsn`. Reports go to Vercel's vitals endpoint for that DSN.
`mode`	None	`'development'` loads the debug script. `'auto'` and `'production'` load the production script. The helper does not detect your environment.
`debug`	None	`true` loads `https://va.vercel-scripts.com/v1/speed-insights/script.debug.js`, which logs reports to the console and sends nothing.
`endpoint`	None	Custom vitals endpoint, set as `data-endpoint`.
`scriptUrl`	`https://va.vercel-scripts.com/v1/speed-insights/script.js`	Loader URL override, such as `/_vercel/speed-insights/script.js` on Vercel. Takes precedence over `mode` and `debug`.
`sampleRate`	`1`	Share of page loads that report, from `0` to `1`, set as `data-sample-rate`. Other values throw a `TypeError`.
`beforeSend`	None	Edits or drops a report while measurement is allowed. Return the event, with a changed `url` if needed, or `null` to drop it.

The helper also sets data-sdkn="c15t" on the script element. Without dsn or endpoint, the collector posts to /_vercel/speed-insights/vitals on your own origin, which exists only on Vercel deployments with Speed Insights on.

Loading and revocation

vercelSpeedInsights uses the measurement category. When measurement becomes allowed, the helper defines the window.siq queue and a window.si stub, unless they exist, registers a beforeSend callback and loads the script.

The collector keeps its listeners after its script element is removed and sends queued reports on pagehide and navigation. On revocation the helper removes the script element and its beforeSend callback starts returning null, so no report is sent, including during the reload c15t runs on revocation. A later grant re-adds the script, which does not start a second collector, and reports resume. Reports also stop when the provider that owns the scripts unmounts.

The collector holds one beforeSend callback. Pass yours through the beforeSend option. Calling window.si('beforeSend', ...) yourself replaces the helper's consent check.

Reports only cover page loads after consent. The collector reads buffered paint and navigation timings, but interactions before consent are missed. The helper does not set data-route, so Vercel groups reports by URL rather than by route pattern such as /blog/[slug].

Verify Vercel Speed Insights

Filter DevTools Network by speed-insights. After you allow measurement, script.js loads from va.vercel-scripts.com with data-sdkn="c15t". Change route or switch tabs, and a POST to /_vercel/speed-insights/vitals follows. Automated browsers that set navigator.webdriver load the collector but send nothing. With debug or mode: 'development' the reports appear in the console instead.

Test in a private window with an opt-in policy. Open DevTools Network, disable the cache and filter by the vendor's domain:

Load the page. No request goes to the vendor before you choose.
Click Reject, then reload. There is still no vendor request.
Open Privacy settings and allow the helper's category. The vendor script loads without a page reload.
Turn the category off again and save. c15t reloads the page, and the new page makes no vendor request.

c15t reloads on revocation because removing a script element does not stop code that already ran. The vendor's listeners, timers and queued events stay alive until the page unloads. If you set reloadOnConsentRevoked: false, stop the vendor yourself. Register a callback-only script whose onConsentChange calls the vendor's opt-out API, as shown in custom integrations, and check the permission before each of your own event calls. The reload does not delete cookies the vendor already set; see clear on revocation for your framework.

The helper sets vendor to its script ID, so once you declare that vendor a visitor can turn it off inside an allowed category. See vendor consent for your framework. The consent verification guide covers navigation, expiry and hosting checks.