INP: cómo hacer que un sitio responda rápido de verdad

Una página puede cargar rápido y aun así sentirse pesada al hacer clic, escribir o abrir un menú. Interaction to Next Paint, o INP, mide precisamente esa capacidad de respuesta durante toda la visita.

Qué mide INP

INP observa la latencia de las interacciones con clic, toque o teclado y registra cuánto tarda la interfaz en mostrar el siguiente frame. web.dev recomienda aspirar a 200 milisegundos o menos en el percentil 75, separando mediciones móviles y de escritorio.

Por qué una interacción se vuelve lenta

• Tareas largas de JavaScript que bloquean el hilo principal
• Manejadores de eventos que realizan demasiado trabajo
• Renderizados grandes o repetidos después de cada acción
• Manipulación excesiva del DOM
• Componentes de terceros que compiten por recursos

Primero datos reales, después laboratorio

Los datos de campo muestran lo que viven usuarios reales; las herramientas de desarrollo ayudan a reproducir y explicar el problema. Conviene identificar la interacción concreta, revisar su duración y separar el retraso de entrada, el procesamiento y la presentación del siguiente frame.

Cómo reducir la latencia

• Dividir tareas largas para devolver control al navegador
• Reducir trabajo dentro de los manejadores de eventos
• Evitar renderizados y cálculos innecesarios
• Actualizar solo la parte de la interfaz que cambió
• Cargar scripts de terceros con intención y medir su impacto
• Dar feedback visual inmediato cuando un proceso necesita tiempo

El rendimiento percibido mejora cuando cada interacción confirma de inmediato que el sistema escuchó al usuario.

Fuente consultada: documentación de web.dev sobre optimización de INP, actualizada en septiembre de 2025.