Interaction to Next Paint (INP)
Interaction to Next Paint (INP) is the Core Web Vitals metric that measures how quickly a page responds when someone interacts with it, such as clicking a button, tapping a menu or typing in a form. It replaced First Input Delay (FID) as a Core Web Vital in March 2024.
What is a good INP score?
- Good: 200 milliseconds or less.
- Needs improvement: between 200 and 500 milliseconds.
- Poor: more than 500 milliseconds.
INP looks at almost all interactions during a visit and reports one of the slowest. It is therefore a much stricter measure than FID, which only looked at the first interaction and only at the delay before processing started.
What an interaction includes
INP measures the full time from the user’s action until the browser paints the next frame showing a response. That time has three parts:
- Input delay: the browser is busy with other work and cannot start handling the interaction.
- Processing time: the event handlers run.
- Presentation delay: the browser recalculates the layout and paints the update.
Any of these can make a page feel sluggish.
Common causes of poor INP
- Heavy JavaScript running on the main thread, especially long tasks over 50 milliseconds.
- Third-party scripts such as chat widgets, analytics, tag managers, A/B testing tools and ad scripts.
- Complex page builders and themes that attach many event listeners.
- Large DOM sizes, which make every layout update slower.
- Expensive work in click handlers, such as recalculating large lists or sending synchronous requests.
- Hydration of JavaScript frameworks that keeps the main thread busy just after load (see JavaScript SEO).
How to improve INP
- Remove or delay non-essential third-party scripts, and load chat widgets only when needed.
- Break up long tasks so the browser can respond between chunks of work.
- Defer JavaScript that is not needed for the first interactions.
- Give immediate visual feedback, such as showing a loading state, and do heavy work afterwards.
- Reduce DOM size by simplifying layouts and removing hidden, unused elements.
- Avoid layout thrashing, where code repeatedly reads and writes layout properties.
- Update plugins and themes, since many have improved INP since 2024.
How to measure INP
INP can only be measured accurately from real users, because it depends on actual interactions. Use the Core Web Vitals report in Google Search Console and the field data section of PageSpeed Insights. For debugging, Chrome DevTools’ Performance panel and the Web Vitals extension show which interactions are slow and why. Lab tools report Total Blocking Time (TBT), which is a useful proxy.
Why INP matters
A page that looks loaded but does not respond feels broken. Slow menus, unresponsive “Add to basket” buttons and laggy forms cost enquiries and sales. Improving INP benefits conversions as much as it helps Page Speed and rankings.
Further reading: web.dev’s guide to Interaction to Next Paint.
Key Takeaways
- INP measures how quickly a page responds to interactions; aim for 200 ms or less.
- Heavy and third-party JavaScript is the main cause of poor INP.
- Break up long tasks and defer non-essential scripts.
- Give instant visual feedback, then do heavy work.
- INP can only be measured accurately with real-user data.
Related Terms
Need a second opinion on your website? Ask for a free website SEO check, or keep learning in the SEO Encyclopedia.