What is INP? SEO Guide for Beginners

Interaction to Next Paint (INP) is a Core Web Vital metric that measures the latency of all user interactions with a page throughout its entire lifecycle. It replaced First Input Delay (FID) in March 2024 as Google's official responsiveness metric. A good INP score is 200 milliseconds or less, while anything above 500 milliseconds is rated as poor.

Why INP Matters for SEO

INP directly measures how responsive your website feels to users. When someone clicks a button, taps a menu, or types in a form field, INP tracks how long it takes for the browser to visually respond. If your page takes half a second to acknowledge a user's click, it feels broken, even if it technically works.

The old metric, FID, only measured the delay of the first interaction. A page could have a great FID score because the first click was fast, but every subsequent interaction could be sluggish. INP fixes this by tracking every interaction and reporting the worst one (roughly the 98th percentile). This gives a much more accurate picture of real-world responsiveness.

Google made INP a Core Web Vital because responsiveness directly impacts user satisfaction and conversion rates. Research consistently shows that pages with slower interaction responses have higher bounce rates and lower conversion rates. For e-commerce sites, every extra 100ms of interaction delay can measurably reduce revenue.

How INP Works

INP tracks three phases of every user interaction: the input delay (time from user action to the browser starting to process it), the processing time (how long the event handlers take to run), and the presentation delay (time for the browser to render the visual update). The sum of these three phases equals the interaction latency.

The metric observes every click, tap, and keyboard interaction throughout the page session. At the end of the session, INP reports the worst interaction latency, with an adjustment for pages with many interactions (it uses the 98th percentile to avoid penalizing pages for rare outliers).

The most common causes of poor INP are long-running JavaScript tasks that block the main thread, excessive DOM size that slows down rendering, and heavy event handlers that perform too much work synchronously. Third-party scripts like analytics, ads, and chat widgets are frequent offenders because they compete for main thread time with your own code.

How to Improve INP on Your Site

1. Break up long JavaScript tasks - The browser cannot respond to user input while a long JavaScript task is running. Use requestAnimationFrame, setTimeout, or the scheduler.yield() API to break long tasks into smaller chunks that let the browser process interactions between them.

Common Mistakes to Avoid

• Running expensive operations in click handlers: If clicking a button triggers a complex calculation, API call, or large DOM update synchronously, the visual feedback will be delayed. Provide immediate visual feedback (like a loading spinner) first, then run the heavy work.

• Ignoring third-party script impact: That live chat widget or social sharing plugin might be adding 200ms+ to every interaction by blocking the main thread. Use Chrome DevTools Performance panel to profile interactions and identify which scripts are causing delays.

• Testing only on fast devices: INP varies dramatically between a flagship phone and a mid-range Android device. Test on real hardware or use Chrome DevTools CPU throttling to simulate slower devices that represent your actual user base.

Key Takeaways

• INP measures how quickly your page responds to every user interaction, not just the first one. Google considers 200ms or less a good score.
• It replaced FID as a Core Web Vital in March 2024, providing a more comprehensive view of responsiveness.
• Break up long JavaScript tasks, reduce bundle sizes, and minimize DOM complexity for the biggest INP improvements.
• Profile your page with Chrome DevTools to identify exactly which interactions are slow and which scripts are causing the delays.