Elimina los recursos que bloqueen el renderizado wordpress

W3 total cache render blocking

Puede que esté familiarizado con los culpables más comunes del bajo rendimiento de las páginas: el exceso de contenido, los archivos de imagen sin comprimir, el alojamiento insuficiente y la falta de caché, por nombrar algunos. Pero hay otro culpable que a menudo se pasa por alto: los recursos que bloquean la renderización.

Si has optimizado el rendimiento de tu página en WordPress y sigues teniendo problemas, los recursos que bloquean la renderización pueden ser los culpables. A veces este código es importante que se ejecute en la primera carga, pero la mayoría de las veces puede ser eliminado o empujado hasta el final de la cola.

Verás una lista de archivos que ralentizan la "primera pintura" de tu página - estos archivos afectan al tiempo de carga de todo el contenido que aparece en la ventana del navegador en la carga inicial de la página. Esto también se llama contenido "above-the-fold".

Autoptimize es un plugin gratuito que modifica los archivos de su sitio web para ofrecer páginas más rápidas. Autoptimize funciona agregando archivos, minificando el código (es decir, reduciendo el tamaño del archivo mediante la eliminación de caracteres redundantes o innecesarios) y retrasando la carga de los recursos que bloquean la renderización.

Eliminar los recursos que bloquean el renderizado wp rocket

Sin embargo, no todos los recursos que el navegador considera que bloquean la renderización son esenciales para la primera pintura; todo depende de las características individuales de la página. Hay buenas prácticas que puedes utilizar para convertir estos recursos no críticos que bloquean la renderización en recursos que no la bloquean. Además, también se puede disminuir el número y/o el tamaño de los recursos de bloqueo de renderización que siguen siendo críticos y que no se pueden eliminar.

LCP mide el tiempo de renderizado del bloque de imagen o texto más grande que es visible en la ventana gráfica del usuario. Si tu ruta de renderización crítica es demasiado larga (tienes demasiados recursos que bloquean la renderización, o los archivos son demasiado grandes), el elemento de contenido más grande tardará más en cargarse. Por lo tanto, para obtener una mejor puntuación LCP, se recomienda mantener el número y el peso de los recursos de bloqueo de la renderización bajo control.

Tanto si tiene un sitio web existente como si aún está en fase de desarrollo, lo primero que debe hacer es encontrar sus recursos de bloqueo de renderizado para poder decidir cómo manejarlos. Por suerte, hoy en día hay muchas herramientas gratuitas de medición del rendimiento que puedes utilizar para este fin.

Optimización automática del bloqueo de la renderización

Los recursos de bloqueo de la renderización retrasan la primera pintura del contenido (FCP), es decir, el momento en el que el navegador renderiza el primer contenido (es decir, el fondo, los colores, los bordes, el texto o las imágenes) en el primer tiempo de carga.

Dicho esto, si su sitio se carga lentamente, es más probable que pierda visitantes, y menos probable que se clasifique bien en las SERPs. A la larga, los recursos que bloquean la renderización de su sitio tendrán un impacto negativo en su negocio.

Las imágenes son los recursos esenciales de cualquier sitio web. Por eso, los usuarios de WordPress suelen pensar que son sus imágenes las que causan problemas de bloqueo. Como resultado, optimizan las imágenes con compresión en lugar de eliminar los recursos de bloqueo de renderización reales que son la verdadera causa del problema.

Incluso más plugins y temas añaden archivos JS y CSS innecesarios de los que hay que ocuparse para eliminar los recursos que bloquean la renderización. Esto nos lleva a cómo eliminar los recursos JS y CSS que bloquean la renderización en WordPress con la ayuda de los plugins.

Para garantizar la máxima precisión en la eliminación de los recursos que bloquean el renderizado, este plugin no se limita a soluciones comunes, sino que se diversifica con características de alta calidad y tareas multifacéticas como

Bloqueo de renderización de Typekit

Una tendencia interesante a tener en cuenta es que se ha producido un aumento de la dependencia de las fuentes de terceros en comparación con las fuentes del sistema. El uso de fuentes de terceros como recurso tiende a interferir con el procesamiento y la renderización de una página.

La ruta crítica de renderizado se refiere a todos los pasos que se necesitan para renderizar la página completa, desde que el navegador empieza a recibir datos hasta que finalmente compila la página en el renderizado final.

Duración máxima del evento: la latencia de la interacción es igual a la mayor duración de cualquier evento del grupo de interacción.Duración total del evento: la latencia de la interacción es la suma de todas las duraciones de los eventos, ignorando cualquier solapamiento.

Con muchos estudios que relacionan la reducción de los tiempos de carga de las páginas con la mejora de valiosos indicadores clave de rendimiento (conversiones, tasa de rebote, tiempo de permanencia en el sitio), la mejora de la latencia del sitio se ha convertido en un objetivo empresarial prioritario para muchas organizaciones.

Uno de los principales objetivos de la optimización de la ruta de renderización crítica es asegurarse de que los recursos necesarios para renderizar ese importante contenido de la parte superior de la página se carguen tan rápido como sea humanamente posible.