WordPress se actualiza en su versión 6.3 Lionel Hampton (músico de lazz americano – wikipedia) desde su salida el 08 de agosto de 2023 y viene cargado de increíbles mejoras de rendimiento con aumentos en tiempos de carga aún mayor que en la versión 6.2 (consulta el listado de versiones de WordPress).
Al contrario que en la versión 6.2 las mejoras de rendimiento se centraban en el lado del servidor a través de mejoras sobre la métrica TTFB (tiempo que pasa desde la petición de un recurso en el servidor y la respuesta de este), en la versión 6.3 las mejoras de performance se centran en el lado del cliente en la métrica de LCP.
Estructura del contenido
Mejoras de rendimiento client-side
La gran mayoría de las mejoras provienen de la optimización del emoji-loader.js .
Donde históricamente ha supuesto en muchos casos un problema que afectaba a la carga del site. Desde la versión 4.4 que ya se podían incluir emojis, algunos webmasters prefirieron no habilitar la opción de convertir ciertos comandos a emojis para no afectar al rendimiento del site.
Es por ello que, a menos que hayas deshabilitado tú manualmente desde tu sitio de WordPress esta funcionalidad de emoji, deberías notar una mejora en el rendimiento por esta nueva mejora del CMS.
Además se han hecho mejoras sobre otros aspectos importantes relacionados con el rendimiento de tu sitio web:
- Atributo para imágenes «loading=lazy».
- Carga de scripts con los atributos «defer» o «async».
Atributo fetchpriority=»high» en Imágenes
Por defecto, y formando parte core de la nueva versión de WordPress, se ha incluido la opción de añadir el atributo fetchpriority=»high» dentro de las etiquetas de imágenes, en especial para aquellas que se encuentran above the fold de las páginas.
El atributo html se utiliza para indicar la prioridad de descarga de un recurso en una página web y permite a los desarrolladores indicar al navegador la importancia relativa de los recursos y la velocidad con la que deben descargarse.
Para este caso concreto donde WordPress habilita su apoyo en el caso de las imágenes «destacadas», si quieres dar una prioridad alta a un archivo de imagen porque suele ser el elemento más grande de un artículo o post (LCP), puedes añadir el atributo «fetch priority» con el valor «high» a la etiqueta de imagen de esta forma:
<img src="ruta-a-tu-imagen.jpg" alt="Imagen" fetchpriority="high">También puedes usar este atributo en otras etiquetas de recursos, como enlaces de CSS o scripts de JavaScript, pero en este caso WordPress lo aplica por defecto sobre las imágenes above the fold porque se ha detectado que resulta ser un recurso muy utilizado por la gran mayoría de sitios de WP.
Cómo monitorizar esta mejora de fetchpriority=high
Te recomiendo que hagas el seguimiento a través de Search Console desde la opción de Experiencia – Métricas web principales, y allí podrás ver por dispositivo las estadísticas de rendimiento y filtrar por LCP para ver cómo han performado a raíz de este cambio.
Analizando las mejoras de rendimiento de WordPress
Para probar estas nuevas mejoras quise asegurarme que efectivamente se estaban aplicando estas acciones sobre los posts y me hice algunas preguntas como: ¿se aplicarán sobre cualquier imagen independiente del formato? es decir, ¿para imágenes WebP optimizadas también?, ¿se aplican las mejoras a todos los posts por defecto?.
Pues bien, lo primero que descubrí al actualizar a la versión 6.3, es que efectivamente aquellas entradas de mi sitio que incluyen una imagen destacada (da igual el formato de la imagen, para WebP también se aplica), dentro de la etiqueta <img> se incluye el atributo por defecto: fetchpriority=»high».
Por cierto, el atributo decoding=»async» se incluye por defecto desde la versión de WordPress 6.1 Misha, independientemente del tipo de imagen.
En términos de rendimiento, analizando la misma entrada con la misma imagen destacada, antes y después de la actualización a 6.3, las estadísticas de LCP mejoraron en 0,3s, además de otras métricas, por lo que la puntuación en conjunto de Rendimiento aumentó en 3 puntos (probado con en este post).
Veremos si después de un tiempo, dentro de Search Console en la parte de Core Web Vitals podemos ver alguna mejora en cuanto a los tiempos de LCP derivados de estas mejoras.
Antes de 6.3: (analizado con PSI)
Después de 6.3: (analizado con PSI)
