La interacción con la siguiente pintura ahora es una métrica Métricas web esenciales estables que reemplaza el retraso de primera entrada.
¡Hoy es el día! Después de años de trabajo, por fin estamos listos para hacer que Interaction to Next Paint (INP) sea una métrica Core Web Vital estable. Esto marca un paso importante en la forma de medir la capacidad de respuesta de las interacciones, ya que aborda muchas de las deficiencias del retraso de primera entrada (FID).
En esta publicación, resumiremos con rapidez qué cambiará exactamente hoy, estableceremos un cronograma más específico para la baja y la eliminación del FID de las herramientas de Chrome, y compartiremos algunos recursos para ayudarte a encontrar y solucionar problemas de INP.
Qué cambiará hoy
En Chrome, todas nuestras herramientas de Métricas web esenciales ahora reflejarán el estado estable de INP cuando corresponda. Por ejemplo, herramientas como PageSpeed Insights, el Panel de CrUX y la extensión Web Vitals mostrarán de forma más prominente la INP en el trío de Métricas web esenciales. Específicamente, en PageSpeed Insights, la lógica de la evaluación de Core Web Vitals evaluará el rendimiento de INP en lugar de FID. Para obtener más información sobre los cambios correspondientes en Search Console, consulta esta entrada de blog del equipo de Búsqueda.
Además, a partir de hoy, algunas herramientas pueden mostrar un aviso de baja de FID como una advertencia de que la métrica ya no es Métrica web esencial y se quitará. En la siguiente sección del cronograma de baja de FID, se analizan las fechas que debes conocer para asegurarte de haber finalizado la transición de FID.
Cronograma de baja de los FID
Ahora que INP reemplazó a FID como una Métrica web esencial, Chrome dejará de admitir oficialmente FID. Esto significa que las herramientas de Chrome ya no garantizarán la disponibilidad de los FID y los desarrolladores tendrán hasta el 9 de septiembre de 2024 para realizar la transición a INP.
Esto es muy importante para los consumidores del Informe sobre la experiencia del usuario en Chrome (CrUX) o las APIs de PageSpeed Insights. Las aplicaciones que procesan datos de FID de cualquiera de estas APIs se deben migrar a INP antes del 9 de septiembre para evitar fallas o interrupciones en el servicio. Para ser claros, esto implicará un cambio rotundo en las versiones más recientes de las APIs, y no habrá cambios en los números de las versiones principales.
Recursos para optimizar INP
Independientemente de si estás analizando INP por primera vez o eres un profesional de la capacidad de respuesta, la colección de recursos de optimización de INP es un excelente punto de partida para encontrar lo que estás buscando. Esta colección perdurable de documentos abarca todos los temas, desde la definición de la métrica en sí, técnicas para medirla a nivel local y con usuarios reales, consejos prácticos para optimizar una variedad de casos de uso y una lista de casos de éxito reales que muestran la orientación en acción.
Con estos documentos, te mostramos un flujo de trabajo general que puedes seguir para encontrar y solucionar los problemas de INP en tu sitio:
Familiarízate con la forma en que INP mide la capacidad de respuesta a las interacciones de los usuarios en los documentos canónicos de INP.
Consulta datos de usuarios reales para evaluar el rendimiento de INP de tu sitio. Al menos el 75% de las experiencias de INP deben responder a la entrada del usuario en menos de 200 milisegundos para que se consideren buenas. Si tu sitio ya tiene un buen INP, no te preocupes.
Conecta tu URL a PageSpeed Insights o consulta el Informe de Métricas web esenciales en Search Console, si tu sitio web se incluye en el conjunto de datos de CrUX.
Consulta con tu proveedor de servicios de análisis si admite la supervisión de INP.
Implementa tu propia solución de INP usando web-vitals.js.
Si es necesario, instrumenta tu sitio para recopilar información de diagnóstico sobre las experiencias de los usuarios. Estos son metadatos importantes, como con qué elemento de la página interactuó el usuario y por qué fue lento, así como otros datos útiles. En conjunto, esta información te ayudará a comprender las mayores oportunidades de mejora.
Reproduce las interacciones lentas de forma local con las Herramientas para desarrolladores de Chrome. Esto te ayudará a ver con exactitud lo que sucede en niveles más profundos y cuál es el código ofensivo.
Optimiza tu código para realizar el menor trabajo posible mientras controlas una interacción del usuario:
Mide los cambios a nivel local y supervisa las experiencias de los usuarios reales para asegurarte de que el rendimiento de la INP sea rápido (y se mantenga así).
Esperamos que esta orientación te encamina por el camino correcto para optimizar la INP. Si experimentas algún problema durante el proceso, siempre puedes obtener ayuda publicando una pregunta etiquetada con interaction-to-next-paint en Stack Overflow.
Lleva mucho tiempo lanzar INP como Core Web Vital. Nos remontamos a nuestra primera publicación sobre cómo crear una métrica de mejor capacidad de respuesta en 2021. Desde entonces, tuvimos en cuenta todos los increíbles comentarios de la comunidad y desarrollamos una métrica que creemos que guiará a los desarrolladores para mejorar un área desatendida de experiencias del usuario, lo que, en última instancia, llevará a una mejor Web. Gracias por ayudarnos a definir esta métrica y por todo el esfuerzo que dedicaste para mejorar el estado de la capacidad de respuesta.