SiteVitals

Interaction to Next Paint (INP)

INP asks one question: when someone taps a button, how long until the screen shows that something happened? It became a Core Web Vital in March 2024, replacing First Input Delay.

Thresholds measured at the 75th percentile of page loads, per Google’s web.dev guidance.

Three phases of every interaction

Input delay: the main thread is busy with something else, so your handler has to wait. Processing: your event handlers run. Presentation delay: the browser recalculates styles and layout and paints the next frame. INP is the sum of all three.

Build a slow tap, then fix it

Interaction latency 250 ms → Needs improvement

How to improve INP

  • Reduce input delay: break up long tasks during load, and defer third-party scripts so the main thread is free when people start tapping.
  • Shorten processing: do the visible update first, then yield (await scheduler.yield(), or setTimeout where unsupported) before analytics, storage or network work. Debounce input handlers.
  • Cut presentation delay: keep the DOM small (Lighthouse warns above about 1,400 elements), avoid forcing layout inside handlers, and use content-visibility: auto for long off-screen sections.
  • Framework apps: avoid re-rendering large trees on every keystroke; use transitions (React startTransition) for non-urgent updates.

Finding your slow interactions

The field data only tells you that INP is slow. To find which interaction, record in the Chrome DevTools Performance panel while using the page on a throttled CPU, or add the web-vitals JavaScript library with attribution to log the slow element to your analytics.

Questions people ask

What is Interaction to Next Paint?

INP measures how long a page takes to visually respond to clicks, taps and key presses. It observes every interaction during the visit and reports one of the slowest (roughly the worst, ignoring one outlier per 50 interactions).

What is a good INP score?

200 milliseconds or less at the 75th percentile. 200–500 ms needs improvement; above 500 ms is poor.

When did INP replace FID?

On 12 March 2024. First Input Delay only measured the wait before the first interaction’s handler started; INP covers the whole response of every interaction.

Why can’t Lighthouse measure INP?

A lab load has no real user interacting with it. Use the field data in our Core Web Vitals checker, and use Total Blocking Time in the lab as a proxy. The Chrome DevTools Performance panel can also record INP while you click around yourself.