WordPress 5.9 puede impulsar una métrica principal de Web Vitals hasta en un 33%

WordPress publicó un artículo en su sección de desarrolladores proponiendo refinar el comportamiento de carga diferida predeterminado de WordPress. Las pruebas revelaron que el cambio propuesto mejoró una métrica de rendimiento de Core Web Vitals en un promedio medio del 7% hasta un 33%.

Propuesta para mejorar los elementos básicos de la web en WordPress

La propuesta establece que el control de grano fino del atributo de carga diferida pertenece a los desarrolladores de temas.

Dicho esto, se descubrió que al refinar cómo se agrega la carga diferida de forma predeterminada, se obtienen mejoras significativas en la métrica Core Web Vitals llamada Largest Contentful Paint.

Así es como la propuesta describe la mejora:

“En lugar de cargar de forma diferida todas las imágenes e iframes de forma predeterminada, la primera imagen de contenido (también teniendo en cuenta las imágenes destacadas) o iframe de contenido no debe cargarse de forma diferida.

Este es un valor predeterminado más sensible que el que usa la implementación actual, que en promedio y a escala dará como resultado un mejor rendimiento de LCP listo para usar, al tiempo que mantiene bajo el ancho de banda necesario “.

Anuncio publicitario

Continuar leyendo a continuación

Carga diferida y pintura con mayor contenido

La carga diferida es una forma de acelerar la descarga percibida de una página al retrasar la descarga de elementos de la página web, como imágenes e iframes, que no son necesarios en este momento.

Al usar la carga diferida, los elementos como las imágenes que no se pueden ver en la pantalla del navegador del visitante del sitio se pueden retrasar mediante el uso de un atributo HTML llamado atributo de carga.

Una imagen es un elemento HTML de una página web.

Un atributo HTML es un código que modifica un elemento HTML, como una imagen.

El atributo de carga modifica la imagen, en este caso, indicando al navegador que retrase la descarga.

El atributo de carga le dice al navegador que demore la descarga de una imagen, liberando al navegador para descargar elementos de página más importantes que son inmediatamente visibles para el visitante del sitio web.

Esto hace que la página sea interactiva más rápida para el visitante del sitio.

La pintura de contenido más grande (LCP) mide qué tan rápido se descargan la imagen y otros elementos en la ventana de visualización de los visitantes del sitio (la pantalla del navegador que ve el visitante).

Anuncio publicitario

Continuar leyendo a continuación

Una imagen generalmente se codifica en HTML de esta manera:

texto de ejemplo

Agregar carga diferida es una simple cuestión de agregar el atributo HTML de carga diferida:

texto de ejemplo

Cómo WordPress 5.9 puede mejorar la pintura con contenido más grande

El desarrollador que publicó la propuesta para mejorar LCP señaló que a partir de WordPress 5.5 el código central agregó el atributo de carga diferida de forma predeterminada a todas las imágenes e iframes.

Pero eso no es ideal porque las imágenes en la parte superior de la página, como los logotipos y las imágenes destacadas, deben descargarse para que la página web sea utilizable.

WordPress implementó la carga diferida de esta manera porque no tenía forma de excluir con precisión las imágenes más importantes para que no recibieran el atributo de carga diferida.

La razón es que todos los temas están codificados de manera diferente y, por esa razón, los desarrolladores de temas pueden realizar mejor este tipo de exclusión granular.

Si bien la implementación actual de WordPress de la carga diferida predeterminada no era ideal, agregar la carga diferida de esta manera es una mejora clara respecto a no agregar el atributo de carga en absoluto.

Lo que se propone representa una clara mejora, como demuestran los resultados de las pruebas que se enumeran a continuación.

Relacionado: Advanced Core Web Vitals: una guía técnica de SEO

Cómo WordPress mejorará la pintura con contenido más grande

Lo que propone el equipo de desarrolladores de WordPress es excluir la adición del atributo de carga diferida a la primera imagen o iframe en el código.

El desarrollador probó este método en los 50 temas de WordPress más populares y descubrió que agregarlo a la primera imagen o elemento iframe proporcionaba una mejora promedio en la puntuación de LCP Core Web Vitals en un promedio del 7%.

A continuación, el desarrollador probó qué tan bien mejoró LCP al agregar carga diferida a dos elementos. Las ganancias de rendimiento se redujeron en un promedio del 2%, lo que deja en claro que excluir la carga diferida de más de un elemento no mejoró LCP mejor.

Estos son algunos de los hallazgos:

“La omisión de la carga diferida de la primera imagen de contenido dio como resultado una mejora media de LCP del 7% (1877 ms en comparación con 2020 ms con el comportamiento del núcleo actual) y un aumento medio de bytes de la imagen del 0% (368 KB en comparación con 369 KB con el comportamiento del núcleo actual). ). → La omisión de la primera imagen de contenido claramente da como resultado una mejora de LCP sin que se produzca una regresión notable en los bytes de imagen guardados.

La omisión de las dos primeras imágenes de contenido para que no se carguen de forma diferida dio como resultado una mejora media de LCP del 5% (1.927 ms en comparación con 2.020 ms con el comportamiento del núcleo actual) y un aumento medio de bytes de imagen del 2% (378 KB en comparación con 369 KB con el comportamiento del núcleo actual). ). → Omitir las dos primeras imágenes de contenido produce peores resultados para ambas métricas que omitir solo la primera, es decir, es mejor omitir solo la carga diferida para la primera imagen de contenido y, por lo tanto, no realizar pruebas adicionales con un mayor número de imágenes que no sean perezosas. se necesitan cargas “.

Anuncio publicitario

Continuar leyendo a continuación

Nuevos resultados de la prueba de carga diferida de WordPress

  • El 5% de los temas en el grupo de prueba obtuvieron puntajes de LCP que fueron un 10% peor hasta un 21% peor.
  • El 42% de los temas mejoraron las puntuaciones de LCP de un 10% a un 33% mejor.
  • Las pruebas revelaron que los beneficios fueron mejores para la mayoría de los temas probados.

Según la propuesta de WordPress:

“Si bien la mejora media de LCP en todos los temas es solo del 7%, hay mayores ganancias notables para un número significativo de temas, mientras que las pérdidas notables son mínimas”.

Relacionado: 18 complementos de WordPress que acelerarán su sitio

Googler crea un complemento de prueba de concepto

Un confirmador de WordPress Core creó un parche de prueba de concepto (POC) en forma de complemento, presumiblemente con fines de depuración y lo publicó en GitHub.

No es un lanzamiento oficial del complemento de WordPress, por lo que no es aconsejable apresurarse a instalarlo.

Las versiones oficiales de complementos se publican en el repositorio de complementos de WordPress.

¿Cuándo llegará la carga diferida refinada?

La línea de tiempo para el comportamiento mejorado de carga diferida está configurada actualmente para WordPress 5.9.

WordPress 5.9 está programado para ser lanzado en diciembre de 2021.

Anuncio publicitario

Continuar leyendo a continuación

La propuesta para la función de carga diferida mejorada se está debatiendo actualmente y hasta ahora ha tenido una respuesta positiva en los comentarios.

Por lo tanto, a menos que surja un problema imprevisto, es muy posible que las puntuaciones mejoradas de la pintura con contenido más grande lleguen a los sitios de WordPress a finales de este año.

Citas

OAnuncio oficial de propuesta de WordPress
Refinando la implementación de carga diferida de WordPress Core

Página de WordPress GitHub para mejorar la carga diferida
Omitir el atributo de carga diferida en la primera imagen de contenido / iframe