Definition

What Is INP (Interaction to Next Paint)?

Interaction to Next Paint — a Core Web Vital measuring the time from a user's interaction (click, tap, keyboard) to the next visual frame being painted. Replaced FID in March 2024.

Related Terms

Core Web Vitals

LCP

CLS

JavaScript

Page Speed

Example

A page with heavy JavaScript blocking the main thread has a poor INP score because clicking a button takes 400ms to visually respond.

As of the March 2024 Core Web Vitals update, approximately 64% of websites pass INP at the 'Good' threshold (under 200ms) — meaning 36% of sites have responsiveness issues that may be impacting both user experience and Google rankings, according to Google's CrUX data.

Synonyms:

Interaction to Next Paint

Acronyms:

INP

What it applies to

Every page with interactive elements — buttons, links, dropdowns, forms, filtering interfaces, and any JavaScript-powered UI. INP is especially problematic on pages with heavy third-party scripts.

How to diagnose poor INP

  • Open Chrome DevTools → Performance tab → record user interactions on the page. Long tasks (red bars, >50ms) blocking the main thread are the primary cause of high INP.
  • Use the INP debugger: web-vitals JavaScript library can log INP details including which interaction is the worst and what scripts are running during it.
  • Check PageSpeed Insights for "Reduce JavaScript execution time" and "Minimize main thread work" diagnostics — these identify the scripts contributing most to INP delay.

How to improve INP

  • Break up long tasks: Any JavaScript task over 50ms blocks the main thread and delays input response. Use scheduler.yield() or setTimeout(fn, 0) to break tasks into smaller chunks, yielding control back to the browser between them.
  • Audit third-party scripts: Chat widgets, ad scripts, and analytics tags are common INP offenders. Load them with async or defer, or delay them until after the first user interaction.
  • Reduce DOM size: Large DOMs (10,000+ nodes) increase style recalculation time triggered by every interaction. Implement virtual rendering for long lists.

INP: Common Questions Answered

Question

Answer