Cómo eliminar los recursos que bloquean la renderización con el plugin Autoptimize + Async JavaScript

Autoptimize y Async JavaScript son dos plugins gratuitos del mismo desarrollador. Juntos, te ayudan a optimizar la entrega de tu CSS y JavaScript.

Una vez que hayas instalado ambos plugins, ve a Configuración → Async JavaScript y:

  • Marque la casilla para Habilitar Async JavaScript en la parte superior.
  • Elija entre Aplicar Asíncrono y Aplicar Aplazamiento en el cuadro de Ajustes Rápidos.

Cómo configurar el plugin Async JavaScript

Si la opción Async causa problemas en tu sitio, te recomendamos que pruebes con Aplazar o excluir jQuery, para lo cual el plugin te da una opción.

Una vez que hayas configurado el plugin Async JavaScript, ve a Configuración → Autoptimización y:

  1. Marca la casilla para Optimizar el código JavaScript
  2. Marque la casilla para optimizar el código CSS

Cómo configurar el plugin AutoptimizeSi eres un usuario avanzado, puedes jugar con los ajustes adicionales de optimización de JavaScript y CSS, pero la mayoría de los sitios estarán bien con los valores predeterminados.

Después de configurar Autoptimize y Async JavaScript, nuestro sitio de prueba pasó la auditoría de PageSpeed Insights “Eliminar los recursos que bloquean la renderización”: