Understanding Interaction to Next Paint (INP)

Interaction to Next Paint (INP) measures how quickly your page responds to user interactions — clicks, taps, and key presses. A good INP is under 200ms. Between 200–500ms needs improvement, and over 500ms is poor.

INP replaced First Input Delay (FID) as a Core Web Vital in March 2024. Unlike FID which only measured the first interaction, INP tracks all interactions throughout the page lifecycle and reports the highest latency, with occasional outliers excluded on high-interaction pages.

What INP actually measures

When a user clicks a button, INP measures the time from the click to the next time the browser paints a visual update. This includes:

• Input delay — time waiting for the main thread to be free
• Processing time — time running your event handlers
• Presentation delay — time for the browser to render the update

Common causes of poor INP

1. Long tasks blocking the main thread

JavaScript that runs for more than 50ms blocks the main thread, delaying the browser's response to user input. Fix: break long tasks into smaller chunks using requestIdleCallback, setTimeout, or thescheduler.yield() API.

2. Heavy event handlers

Click handlers that do expensive computation (sorting large arrays, complex DOM manipulation) before updating the UI feel sluggish. Fix: do the minimum work needed to show a visual response, then defer heavy work.

3. Too many third-party scripts

Analytics, chat widgets, ad scripts, and tracking pixels all compete for main thread time. Fix: audit your third-party scripts, remove unused ones, and load non-essential scripts with defer or after user interaction.

4. Large DOM size

Pages with thousands of DOM nodes are slower to update because style recalculation and layout become expensive. Fix: virtualise long lists, simplify your DOM structure, and avoid deeply nested elements.

How to measure INP

INP requires real user data to measure accurately. Use Google Search Console's Core Web Vitals report, the Web Vitals Chrome extension (for local testing), or PageSpeed Insights which now reports INP from the Chrome User Experience Report (CrUX).