INP Interaction to Next Paint

INP Interaction to Next Paint

Stiven Castillo
June 07, 2023

Interaction to Next Paint (INP) is a web performance metric that measures how quickly a page responds to user interactions. It is a pending Core Web Vital metric that will replace First Input Delay (FID) in March 2024.

INP is measured by observing the latency of all click, tap, and keyboard interactions that occur throughout the lifespan of a user’s visit to a page. The final INP value is the longest interaction observed, ignoring outliers.

A low INP score means that the page responds quickly to user interactions, while a high INP score means that the page takes longer to respond. A good INP score is considered to be under 300 milliseconds.

There are a number of things that can affect INP, including:

  • The size and complexity of the page
  • The use of images and other large resources
  • The loading speed of the server
  • The performance of the user’s device
  • The way the page is coded

There are a number of things you can do to improve INP, including:

  • Minifying and compressing your CSS and JavaScript files
  • Using lazy loading for images and other large resources
  • Serving your pages from a CDN
  • Optimizing your JavaScript code
  • Using a Content Delivery Network (CDN)
  • Using a framework like React or Vue that is designed to be performant

INP is an important metric to consider when optimizing the performance of your web pages. A low INP score will help to ensure that your pages are responsive and provide a good user experience.

https://web.dev/inp/#what-is-inp