El INP o Interaction to Next Paint es una métrica de rendimiento web que mide la capacidad de respuesta de una página ante las interacciones del usuario. En palabras sencillas, es el tiempo que transcurre desde que un usuario hace clic, toca un botón o escribe algo en tu web, hasta que la página responde visualmente en pantalla.
A diferencia de otras métricas, el INP no se fija solo en un momento puntual, sino que observa todas las interacciones registradas durante la visita. Es, actualmente, la medida más precisa para saber si tu sitio web se siente «ágil» o si, por el contrario, parece que la web se ha quedado bloqueada tras un clic.
¿Por qué es vital para el éxito de tu web?
Si el LCP es el tiempo de espera hasta que la web carga, el INP es el tiempo de espera mientras la web intenta trabajar para ti.
- Sensación de fluidez: Un INP bajo garantiza que tu web responda de forma inmediata. Esa respuesta instantánea es lo que separa a una aplicación profesional de una que se siente «pesada» o rota.
- Factor SEO: Al igual que el LCP, el INP forma parte de los Core Web Vitals de Google. Si tu puntuación de INP es alta (es decir, lenta), Google penalizará la experiencia de usuario de tu página en sus resultados de búsqueda.
- Reducción de frustración: Nada irrita más a un usuario que pulsar un botón y no ver nada durante un segundo. Si el usuario siente que el sistema no responde, su instinto es cerrar la pestaña, lo que dispara tu tasa de rebote.
Los baremos de Google en el INP
El INP se mide en milisegundos (ms) y se categoriza de la siguiente forma:
- Buena (Good): 200 milisegundos o menos. Aquí es donde todas las webs profesionales deberían estar.
- Necesita mejorar (Needs Improvement): Entre 200 y 500 milisegundos. La web empieza a sentirse ligeramente lenta.
- Pobre (Poor): Superior a 500 milisegundos. La experiencia es frustrante; el usuario nota un retraso evidente entre su acción y la respuesta de la web.
¿Cómo puedes mejorar tu INP?
El culpable número uno de un mal INP es, casi siempre, el JavaScript excesivo o mal optimizado. Cuando el navegador intenta procesar muchas tareas a la vez, se «atasca» y no puede renderizar la respuesta a tu interacción.
- Reduce el exceso de JavaScript: Analiza qué scripts se cargan en tu web. Si tienes herramientas que no usas o que no son críticas para la interacción inicial, elimínalas o retrasa su carga.
- Divide las tareas largas: Un navegador hace una cosa a la vez. Si tienes una tarea de JavaScript que tarda 300ms en ejecutarse, el usuario no podrá interactuar con nada hasta que termine. Fragmentar ese código permite que el navegador pueda «respirar» y responder al usuario entre tarea y tarea.
- Evita el «Main Thread» saturado: Asegúrate de que el hilo principal del navegador no esté sobrecargado con lógica innecesaria justo después de que la página cargue.
- Optimiza los eventos: Si usas muchos listeners de eventos (código que reacciona a los clics), asegúrate de que sean eficientes y no ejecuten cálculos pesados de forma innecesaria.
En definitiva, el INP es el guardián de la interactividad. No basta con que tu web sea bonita y cargue rápido; si cuando el usuario quiere interactuar con ella el sitio se queda «congelado», habrás fallado en la experiencia de usuario. Mantener este valor bajo es la clave para una web que se siente moderna, profesional y, sobre todo, funcional.