WP Rocket es uno de los plugins de caché mejor valorados en WordPress gracias a que brinda un monton de características que te ayudan a subir tu pagespeed sin complicarte mucho en la configuración. Es un plugin realmente costoso pero de verdad que merece la pena.

Veamos como configurar el plugin y colocar los ajustes recomendados para una web ecommerce. En este caso, vamos a configurarlo para la web de disfraz de princesa.

Ajustes recomendados para WP Rocket

Una vez que hemos instalado y activado el plugin, hacemos clic en settings o ajustes para ir al panel de configuración del plugin.

wp rocket plugin

WP Rocket Dashboard

Al entrar al dashboard del plugin, puedes ver que ya el plugin está activado.

wp rocket wordpress plugin

En la sección Dashboard no hay nada que hacer. Ahí solo vemos los datos de nuestra cuenta y poco más.

WP Rocket Cache

En la sección Cache, vamos a habilitar el caché de nuestras páginas tanto en desktop como en mobile. Esto logrará mejorar nuestro TTFB.

plugin wp-rocket

Enable caching for mobile devices

Debe estar activado. Esto activa el caché para navegadores de dispositivos móviles.

Separate cache files for mobile devices

Activado. El caché de moviles de WP Rocket trabaja mejor con esta opción activada.

Enable caching for logged in WordPress users

Desactivado. Solo activalo si tienes muchos usarios para un mismo WordPress o si tienes sitios de membresías.

Cache lifespan

Yo lo dejo en 24 horas ya que no actualizado esa web más de una vez al día. Este ajuste define cada cuanto tiempo la web hace un nuevo caché.

WP Rocket – File Optimization

wp-rocket plugin

En esta sección podemos combnar nuestros CCSs y tocar algunas cositas para optimizar nuestro codigo.

Minify HTML files

Activado. Elimina los comentarios y espacios para reducir el tamaño total del código de tu web.

Combine Google Fonts files

Activado. Si usas multiples tipos de fuentes, esto activado reduce el número de solicitudes hacia los servidores donde se encuentran esas fuentes alojadas.

Remove query strings from static resources

Activado. Remueve la versión query string de los archivos estáticos.

Minify CSS files

Activado. Elimina los comentarios y espacios para reducir el tamaño total del código CSS de tu web.

Combine CSS files

Activado. Combina todos los arvhicos CSS de tu web para reducer el número de peticiones al servidor.

Optimize CSS delivery

Activado. Eliminar los recursos que retrasan el renderizado de tu web (render blocking resources). Esto optimiza la velocidad de carga de tu web.

Minify JavaScript files

Activado. Elimina los comentarios y espacios para reducir el tamaño total del código JavaScript de tu web.

Combine JavaScript files

Activado. Combina todos los archivos javascript en uno único. Esto reduce el número de peticiones al servidor.

Load JavaScript deferred

Activado. Carga los códigos javascript de forma diferida de manera que no afecten el renderizado (usabilidad) de la web. Esto mejora el tiempo de carga de tu web y mejora el PageSpeed.

Safe Mode for JQuery

Activado. Permite la carga de jQuery bajo demanda.

WP Rocket – Media

wp rocket plugin wordpress

En la sección Media vamos a optimizar el uso de archivos multimedia de nuestra web.

Lazy load – Enable for images

Activado. Las imagenes serán cargadas bajo demanda. Es decir, solo cargarán cuando estén a la vista del usuario.

Lazy load – Enable for iFrames and Videos

Activado. Los video y Iframes serán cargados bajo demanda. Es decir, solo cargarán cuando estén a la vista del usuario.

Replace YouTube iframe with preview image

Activado. En vez de cargar el script del video completo, solo cargará un poco de código cuando esté a la vista del usuario.

Disable Emoji

Activado. Reduce el numero de peticiones al servidor.

WordPress embeds

Activado. Con esto se previene que otras webs incrusten contenido desde tu web saturando tu ancho de banda e incrementado tus peticiones al servidor.

Enable WebP caching

Esto lo puedes activar solo si usas imegenes en formato WebP en tu web.

WP Rocket – Preload

plugin wordpress wp rocket

La Precarga ayuda a optmizar los tiempos de caché de tu web cada vez que hacemos modificaciones. Veamos los ajustes recomendados.

Activate preloading

Activado. Permite que WP Rocket haga el caché de forma automática cada vez que hacemos cambios en nuestra web.

Activate Sitemap-base cache preloading

Activado. Usa el Sitemap para hacer la precarga de todas tus URLs una vez que la fecha de expiración del cache se ha alcanzado.

Yoast SEO XML sitemap

Activado (Si usas Yoast SEO). WP Rocket detecta el SiteMap directamente desde el Plugin Yoast SEO.

Prefetch DNS requests

Coloca los dominios de tu preferencia para carga de recursos externos en paralelo.

WP Rocket – Advanced Rules

No tocar nada acá.

WP Rocket – Database

wp rocket plugin download

Acá podemos depurar nuestra base de datos de WordPress. Eliminando algunas cosas innecesarias podemos reducer el tamaño de nuestra base de datos.

Post cleanup

Puedes eliminar las revisiones y borradores de Posts que ya no necesites.

Comments Cleanup

Puedes eliminar los comentarios Spam o que se encuentran en la papelera de reciclaje de tu base de datos.

Transients Cleanup

Puedes eliminar los archivos de configuraciones opcionales de pugins o temas que alguna vez instalaste.

Database Cleanup

Puedes optimizar las tablas de la base de datos de tu WordPress.

Automatic cleanup

Si quieres, puedes activar la limpieza automática. No lo recomiendo.

WP Rocket – CDN

wp rocket wp plugin

Si usas Cloudflare como tu proveedor CDN (como es mi caso), no es necesario hacer nada acá.

WP Rocket – Addons

wp rocket

Vamos a enlazar el plugin con algunas herramientas importantes. Solo debes activar cada item que te interese. En mi caso, he activado:

  • Google Analitycs
  • CloudFlare

Al activar Cloudflare, tienes que configurarlo haciendo clic en Modify Options.

configurar wp rocket

Luego te va a pedir tus credenciales de CloudFlare.

como configurar wp rocket

Development Mode

Solo activarlo si estás haciendo grandes cambios en tu Web.

Optimal Settings

Activado. Permite mejorar los ajustes de tu Cloudflare.

Relative Protocol

Si no estás usando Flexible SSL en Cloudflare, dejarlo desactivado.

WP Rocket – Image Optimization

como usar wp rocket

Acá puedes instalar el plugin Imagify.

WP Rocket – Tools

wp rocket para que sirve

En tools podemos importar/exportar nuestros ajustes para ser reusados en otros proyectos que tengas.

Scroll to Top