INP y Core Web Vitals en la práctica

Una página puede mostrar el primer contenido rápido y reaccionar lentamente a un clic. La revisión de rendimiento incluye también las tareas posteriores del usuario.

Qué ayuda a evaluar INP

INP describe la respuesta ante clics, toques y uso del teclado. El diagnóstico comienza con acciones concretas que se sienten lentas, no con cambios arbitrarios de código.

Documentación: web.dev.

Partir de un escenario

Abrir un menú, añadir un producto o desplegar filtros sirve como prueba. Registramos dispositivo, condiciones y momento del retraso. Una medición aislada no representa a todos los usuarios.

Identificar el trabajo que retrasa

Revisamos cálculos, actualizaciones visuales y scripts durante la interacción. La mejora elimina tareas innecesarias o cambia su orden. Una animación de espera no resuelve la causa por sí sola.

Ejemplo de filtro complejo

Si una selección recalcula toda la lista varias veces, investigamos esa repetición. Después comprobamos velocidad y exactitud. Un filtro rápido no es un éxito si omite productos o usa datos antiguos.

Recepción y seguimiento

Comparamos el mismo escenario antes y después, y observamos los datos reales disponibles. Conservamos las condiciones de prueba. Nuevos scripts, componentes e integraciones también deben evaluarse por su efecto en las interacciones.