Core Web Vitals es un conjunto de métricas que Google ha definido para medir la calidad de la experiencia del usuario de un sitio web. Se convirtieron en una señal de clasificación por primera vez en 2021.

Si bien las definiciones de métricas han cambiado con el tiempo, la introducción de la métrica Interaction to Next Paint es el mayor cambio desde que comenzó la iniciativa Core Web Vitals.

¿Qué es Next Paint Interaction (INP)?

Next Paint Engagement es una métrica que califica la rapidez con la que su sitio responde a las interacciones de los usuarios. Mide el tiempo entre la entrada del usuario, p. B. un clic de un botón y se lleva a cabo la actualización del contenido de la siguiente página (la “próxima pintura”).

Para una mejor clasificación en Google, este retraso de interacción debe ser inferior a 200 milisegundos. Esto asegura que el sitio web responda a los usuarios.

¿Cómo está evolucionando Core Web Vitals?

Google ha anunciado que la interacción con Next Paint se convertirá en una de las tres métricas de Core Web Vitals en marzo de 2024. En este punto, un sitio que es demasiado lento para responder a los comentarios de los usuarios puede tener una clasificación más baja en los resultados de búsqueda.

El INP reemplaza la medición actual de First Input Delay (FID). Si bien el FID también mide la capacidad de respuesta, es más limitado ya que solo considera la interacción inicial del usuario. Además, solo mide el retraso antes de comenzar a procesar el evento de entrada, en lugar de esperar a que el usuario vea el resultado.

Actualmente, solo el 64,9 % de los sitios móviles obtienen una buena puntuación en la métrica de interacción de Next Paint, y será más difícil obtener una buena puntuación de INP que una buena puntuación de retraso en la primera entrada.

¿Cómo puedo medir la métrica “Interacción con la próxima pintura” en mi sitio web?

Ejecute una prueba de velocidad del sitio para ver qué tan rápido carga su sitio y qué tan rápido responde a la entrada del usuario.

Abra la pestaña Web Vitals una vez que se complete la prueba. Puede ver la métrica de interacción de color más cercana en la parte inferior de la página.

En este caso, solo el 38% de los usuarios tienen una buena experiencia INP.

¿Cómo puedo optimizar la interacción con Next Paint?

Los retrasos en la interacción ocurren cuando el navegador tiene que hacer mucho procesamiento de la CPU antes de actualizar la página. Esto puede suceder por dos razones:

• La ejecución de tareas en segundo plano evita que se procesen las entradas del usuario
• Procesar la entrada del usuario lleva mucho tiempo

Las tareas en segundo plano generalmente se ejecutan cuando la página se carga por primera vez, pero también pueden ejecutarse más tarde. Por lo general, son causados ​​​​por un código de terceros incrustado en el sitio web.

Responder a una interacción del usuario puede requerir mucho procesamiento. Si esto no se puede cambiar, considere mostrar una rueda giratoria para proporcionar comentarios visuales hasta que se complete la tarea de procesamiento.

La ejecución de código JavaScript es el tipo de procesamiento más común, pero incluso las actualizaciones visuales complejas pueden llevar mucho tiempo.

Use Chrome DevTools para analizar el rendimiento

Chrome DevTools Performance Profiler muestra las tareas que consumen mucho tiempo y que deben optimizarse. Inicie una grabación, haga clic en un elemento de la página, luego haga clic en las barras más largas en la vista previa.

Esto le permite ver si el código es de un tercero o de su propio sitio. También puede profundizar para ver cómo se puede acelerar la tarea.

Verifique la métrica de tiempo total de bloque para identificar tareas en segundo plano

La métrica Total Block Time rastrea la frecuencia con la que las tareas de CPU en segundo plano pueden impedir que se ejecute otro código. Si el usuario interactúa con la página mientras una tarea ya está en curso, el navegador completará esa tarea antes de manejar el evento de entrada.

Puede usar herramientas como Google Lighthouse para ver cómo se puede cambiar esta métrica.

Si las tareas de procesamiento intensivo en su sitio son parte del código principal del sitio, debe trabajar con su equipo de desarrollo para optimizarlas. En el caso de terceros, puede comprobar si todavía se necesita el script o ponerse en contacto con el servicio de atención al cliente del proveedor para ver si se puede optimizar el código.

Supervisar la interacción con el siguiente color

¿Quiere realizar un seguimiento de su rendimiento en INP y otros Core Web Vitals? DebugBear puede rastrear la velocidad de su sitio web y ayudarlo a optimizar su sitio web.

Comience una prueba gratuita de 14 días hoy y garantice una mejor experiencia de usuario.

Título Universitario

La métrica Interacción con Next Paint representa el mayor cambio en Core Web Vitals de Google desde su anuncio inicial. INP soluciona las deficiencias de la métrica de retraso de la primera entrada anterior y proporciona una mejor representación de cómo los usuarios perciben un sitio web.

Descubra cómo se clasifica su sitio en la métrica de participación de Next Paint antes de que se implemente el cambio de clasificación de 2024. Esto le da mucho tiempo para identificar optimizaciones y hacer que su sitio sea más rápido.

Pruebe DebugBear con una prueba gratuita de 14 días.