Skip to main content

What does the Core Web Vitals API do?

Frontend ToolsJunior~1 min read
Suggest an edit

The Core Web Vitals API is a set of JavaScript interfaces used to collect real UX metrics directly from the user, rather than from synthetic tests.

What it collects:

It measures and returns Web Vitals metrics in real time, such as:

  • LCP: when the main content loads
  • FID: the delay on the first interaction
  • CLS: how much the interface jumps around
  • INP: a new metric replacing FID (Interaction to Next Paint)
  • FCP, TTFB: additional speed metrics

How it's used:

  1. Include the web-vitals JS library:
js
import {getLCP, getFID, getCLS} from 'web-vitals' getLCP(console.log) getFID(console.log) getCLS(console.log)
  1. The metrics can be:
  • sent to Google Analytics
  • logged to a server
  • sent to BigQuery, Sentry, and so on

What it gives you:

  • real data from actual users
  • visibility into how the site performs on different devices and networks
  • the ability to track UX in production, not just in Lighthouse
  • used to analyze problems that are not visible in a test environment

Example of practical use:

  • LCP is too high for users on 3G → you optimize images
  • CLS spikes at a certain resolution → you double-check the layout
  • INP is high on Android Chrome → you look for heavy JS and long tasks

Conclusion: The Core Web Vitals API is a way to track performance through the user's eyes, live. It's reality, not a lab.

Short Answer

Interview ready
Premium

A concise answer to help you respond confidently on this topic during an interview.

Suggest an edit