vTilt
Why vTiltHow It WorksFeaturesFAQDocs
Docs / Web Vitals
Quick startEvent forwarding
MCP server
Guides
OverviewAuthenticationOAuthAgent skills (prompts)AI intelligenceGoogle Ads
Client setup
CursorClaude DesktopVS CodeCodex
Realtime
Debug ViewRealtime Dashboard
Integration guides
Frontend frameworks
Next.jsNuxt.jsVue.jsReactReact RouterRemixGatsbySvelte / SvelteKitAstroAngularTanStack StartDocusaurus
Backend frameworks
NestJSHonoCloudflare WorkersDjangoFlaskLaravelPhoenixRuby on Rails
Backend languages
PythonPHPRubyElixirGoJava.NET / C#Rust
Stack guides
Vue + PHP
SDK
Browser SDK
InstallScript bundlesEvent trackingAutocaptureIdentify & aliasWeb VitalsSession recordingChat widgetFeature readinessRemote configurationReverse proxyDebug logging
Node SDK
Install & setupCapture, identify & aliasContext & shutdown

Documentation

vTilt
Quick startEvent forwarding

MCP server

Realtime

Debug ViewRealtime Dashboard

Integration guides

SDK

InstallScript bundlesEvent trackingAutocaptureIdentify & aliasWeb VitalsSession recordingChat widgetFeature readinessRemote configurationReverse proxyDebug logging
DocsBrowser SDKWeb Vitals

Web Vitals

Capture Core Web Vitals (LCP, CLS, FCP, INP, TTFB) for performance monitoring.

Capture Core Web Vitals — the metrics Google and most performance tools use to judge real-world user experience.

Tip

Tip: array.full.js pre-bundles web vitals with session recording so no separate web-vitals.js fetch is needed.

#Enable

Set capture_performance: true in init. The SDK lazy-loads the web-vitals library and emits one event per metric per page.

vt.init('YOUR_PROJECT_TOKEN', {
  api_host: 'https://www.vtilt.com',
  capture_performance: true,
})
typescript

#Metrics captured

MetricWhat it measures
LCPLargest Contentful Paint — when the main content is visible.
CLSCumulative Layout Shift — visual stability through page life.
FCPFirst Contentful Paint — when any content first paints.
INPInteraction to Next Paint — input responsiveness across the page.
TTFBTime to First Byte — server response latency.

Each metric is reported as a $webvitals event with the metric name, value (ms or unitless for CLS), rating (good / needs-improvement / poor) per the official Web Vitals thresholds, and the page URL.

Note

Note: INP and CLS keep updating throughout the page lifetime; vTilt batches their final values on pagehide / visibilitychange so the reported numbers reflect the user's whole experience, not the initial paint.

PreviousIdentify & aliasBrowser SDKNextSession recordingBrowser SDK

On this page

  • Enable
  • Metrics captured