Un año (y algo más) después de escribir el primer post sobre WP Rocket en este blog, vuelvo a escribir sobre el tema porque en este tiempo me he hecho bastante fan de este estupendo plugin de cache para WordPress.
WP Rocket es un plugin de cache que nos ayuda con el WPO del sitio web ya que, además de cache, tiene otras funcionalidades bastante interesantes.
Tengo que volver a decir siempre, que hasta que conocí WP Rocket, nunca consideré la opción de pagar por un plugin de cache para WordPress… Sin embargo, también he de admitir que no utilizo WP Rocket por regla general: existen otros plugins de cache MUY interesantes como W3 Total Cache, Swift Performance o LiteSpeed Cache y tenemos que utilizar uno u otro en función de las necesidades del proyecto.
Con esto quiero que entiendas que cada proyecto es diferente y tiene unas necesidades distintas de cara al cache. No es lo mismo cachear un blog normal que un ecommerce con WooCommerce o una red social con BuddyPress.
Voy a intentar estructurar este post de forma que cubra todos los aspectos de este plugin y todas las posibilidades. WP Rocket ha avanzado mucho en el último año y se han puesto bastante las pilas, aunque aún les faltan bastantes cosas por hacer.
Ventajas de WP Rocket
Antes de nada, vamos a listar las tres principales ventajas que tiene WP Rocket frente a otros competidores como los de mi post sobre plugins de cache para WordPress.
Curva de aprendizaje y dificultad de configuración: Lo primero que ha hecho bien WP Rocket es que la configuración es mucho más fácil que en los otros plugins, simplificando el proceso y acercando el cache y el WPO a todos los usuarios sin necesidad de ser técnicos.
Soporte técnico y ayuda: El soporte técnico y la atención al cliente del equipo de WP Rocket es BRUTAL. Además, no solo atienden temas de cache, sino que también tocan temas de optimización de código JS y CSS, tweaking, etc.
Eficiencia y estabilidad: WP Rocket es una excelente opción cuando se busca eficiencia y estabilidad, ya que por lo general no suele fallar y su soporte responde muy rápido. Las respuestas desde cache son rápidas y el plugin no consume muchos recursos.
También hay que comentar que, mediante Imagify (otro plugin de WP Media), el propio WP Rocket nos permite implementar fácilmente webP de una forma efectiva.
Desde hace poco, WP Rocket también tiene su propio servicio CDN, llamado RocketCDN, que podemos autoconfigurar mediante WP Rocket. Esto para usuarios técnicos es “irrelevante”, pero para usuarios NO técnicos implica poder implementar un CDN en WordPress fácilmente.
La empresa desarrolladora de WP Rocket e Imagify se llama WP Media. Son unos franceses que han ido creciendo mucho a lo largo del tiempo y que, en el momento de publicar este artículo en abril de 2020, tenían más de 1 millón de sitios web usando WP Rocket (desde los 600.000 que tenían en diciembre de 2018).
Ahora mismo, WP Rocket es uno de los plugins premium más utilizados del mundo. Y esto no es solo por todo lo que he explicado sobre el plugin, sino también por el soporte aportado por WP Media cuando hay problemas.
¿Cuándo utilizar WP Rocket? ¿Qué otras opciones hay?
Antes he expuesto varios plugins de cache y he comentado que podemos usar uno u otro en función de las necesidades del proyecto.
A continuación, te dejo unos ejemplos de qué utilizar en cada caso y por qué (sin profundizar mucho porque este post trata sobre WP Rocket y no sobre plugins de cache en general):
WP Rocket: Blogs normales o sitios web corporativos estáticos, que no tengan partes dinámicas o que tengan muy pocas.
WP Rocket solo tiene cache en disco, nada de cache de objetos en Memcached ni ningún tipo de cache avanzado. Por eso, puede tener “problemas” en proyectos muy complejos y muy dinámicos como ciertos ecommerce o comunidades. En esos casos, no conviene utilizar WP Rocket.
W3 Total Cache: Sitios web WordPress muy complejos y con necesidades especiales de cache, es decir, sitios web muy dinámicos.
W3 Total Cache es lo más avanzado en plugins de cache para WordPress y es la única solución en aquellos casos donde hay que combinar cache de página con cache de objetos y cache de consultas a la DB de MySQL.
El problema de W3 Total Cache es que no compensa instalarlo en blogs y sitios web simples porque requiere bastante configuración y consume muchos recursos (todo lo contrario a WP Rocket).
Swift Performance Pro: Es un buen plugin intermedio. Puede ser bueno para sitios web básicos y también para sitios web complejos hasta cierto nivel de dinamismo, aunque no es un plugin tan extremo como W3 Total Cache.
Swift Performance Pro es una buena opción para ecommerce con WooCommerce, ya que incluye parámetros de configuración que pueden ayudar.
LiteSpeed Cache: Es un plugin intermedio también, pero puede ser una excelente opción en servidores web con LiteSpeed como los hostings de Raiola Networks. Su rendimiento va muy similar a WP Rocket en estos casos.
Estas 4 opciones tienen una cosa en común y es que, además, llevan ciertos tweaks para WordPress y también permiten optimizar el JS y CSS con mayor o menor efectividad dependiendo del plugin.
No me voy a liar más. A partir de aquí empieza la práctica.
Si necesitas ver antes un vídeo-repaso sobre WP Rocket y todas sus opciones, te lo dejo a continuación. Ten en cuenta que, depende de cuándo lo veas, puede estar un poco desactualizado:
Configurar cache con WP Rocket en WordPress
Uno de los puntos fuertes que tiene WP Rocket y que simplifica mucho la implementación de cache (uno de sus puntos fuertes) es que, según activas el plugin, ya está el cache activado.
La pantalla que podemos ver con el plugin activado es esta:
Evidentemente, eso no quiere decir que no falten cosas y que podamos configurar y personalizar el comportamiento del cache pero es importante saber que, si activas WP Rocket, ya tienes cache.
WP Rocket SOLO tiene cache de página guardado en disco, no es compatible con ningún otro tipo de cache y eso es una ventaja y un inconveniente al mismo tiempo.
De forma nativa, al activarse el cache de página en disco también se hacen las modificaciones necesarias en el .htaccess de WordPress para que se active el browser cache o cache de navegador, algo indispensable actualmente.
Esto en WP Rocket no tiene ningún tipo de control, es decir, no podemos personalizar su funcionamiento, ya que se activan los ajustes recomendados por defecto y, si queremos modificarlos, debemos hacerlo directamente en el .htaccess.
Sección “Cache” de WP Rocket
Para empezar con la configuración del comportamiento del cache, debemos ir a la pestaña “Cache”:
Lo que ves en la imagen anterior es el contenido de la sección “Cache”. La configuración, normalmente, se deja como en la foto para webs estáticas o blogs.
En la sección “Cache móvil” marcamos la primera opción llamada “Habilitar cache para dispositivos móviles” para que evidentemente se sirva cache a los dispositivos móviles, pero dejamos desmarcada la opción “Guardar separadamente los archivos para dispositivos móviles”. Esto se debe a que actualmente, salvo que tengas una versión específica para móviles (que actualmente no se suele implementar), esta opción no sirve para nada.
En cuanto a la siguiente sección y a la opción “Habilitar la cache para los usuarios conectados a WordPress”, la dejamos siempre desmarcada salvo que sepamos exactamente lo que hacemos. Esta opción se utiliza normalmente para sitios web con login como WooCommerce, zonas de membresías o comunidades, pero siempre con cuidado de no servir contenidos personales cacheados a otros usuarios. Aunque en teoría no debería haber problema, ya que se crea una versión de cache para cada usuario por separado, lo cierto es que yo ya he visto casos complejos donde hubo fallos de protección de datos al servir cache de un usuario a otro usuario.
En cuanto a la última sección y a la opción llamada “Especifica el tiempo tras el cual quieres borrar la cache global”, debemos poner un valor diferente dependiendo del proyecto y de sus necesidades.
En blogs normales o sitios web corporativos, poner 0 y confiar en las políticas de vaciado de cache es lo ideal. Sin embargo, en sitios web más dinámicos creo que especificar un valor entre 4 y 12 está bien, para “purgar” en caso de que aparezca algún problema en el cache almacenado y servido.
En esta sección no hay nada más que tocar, por lo que avanzamos a la siguiente.
Sección “Precargar” de WP Rocket
La sección “Precargar” es uno de los puntos fuertes de WP Rocket, porque han ido mejorando esta funcionalidad hasta conseguir que funcione perfectamente. En las primeras versiones de WP Rocket, la función de precargar cache podía llegar a tumbar una web con el bot de precarga. Esto lo he visto yo personalmente en la versión 3.0 de WP Rocket.
En la sección “Precargar” nos encontramos esto:
Esta sección es muy importante, pero al mismo tiempo es muy fácil de configurar.
Por si no lo sabes, el precache es lo que se encarga de que el cache sea efectivo de verdad. Antiguamente, los plugins de cache creaban una copia cacheada cuando un visitante entraba a la web, pero eso significaba que ese visitante en cuestión iba a recibir una respuesta lenta de la web. Con los sistemas de precache que llevan los plugins de cache actuales, NINGÚN visitante debería recibir una respuesta lenta, ya que precisamente se trata de servir SIEMPRE cache.
Para activar la precarga, simplemente activamos la opción “Activar la precarga” y después también la opción “Activar la función de precarga de cache a través del mapa del sitio”. Ahora viene la parte “difícil”.
WP Rocket realiza la precarga de cache desde el sitemap del sitio web, el que crean plugins como Google XML Sitemaps, Yoast SEO o RankMath, pero para eso debemos tener uno de estos plugins instalados y con el módulo de sitemaps activados. Si no tenemos ninguno, debemos insertar manualmente el sitemap en el cuadro “Mapas del sitio para precargar”. Evidentemente, tienes que tener un sitemap en tu sitio web para el SEO, creado de una forma o de otra.
Ahora vamos a la parte de abajo de todo, la sección “Precarga de peticiones DNS”, Vas a ver otro cuadro de texto donde debes introducir ciertas URL o peticiones externas que realiza tu web.
El objetivo de esto es que se pre-cacheen mediante prefetchDNS los hostnames a los que se realizan las peticiones externas de la web. Con esto no se consigue MUCHA velocidad de carga, pero puede ayudar en sitios web donde se realizan muchas peticiones externas.
Sección “Reglas avanzadas” de WP Rocket
Por último, tenemos la sección “Reglas avanzadas” donde podemos configurar excepciones en el cache de WP Rocket. Esta parte está destinada a “jugar” con el cache y seleccionar de forma avanzada las partes que no se van a servir desde el cache y qué criterios seguir.
No te voy a explicar exactamente lo que debes poner en esta sección porque cada proyecto es diferente y lo que hay que configurar en cada caso varía mucho.
En casos de ecommerce creados con WooCommerce, te recomiendo que introduzcas las URL de “Mi cuenta” y las páginas de carrito, aunque se supone que WP Rocket ya viene preparado para detectar páginas de sesión y que debería añadirlas automáticamente.
WP Rocket permite filtrar por cookie, user-agent, query string y por URL.
Optimización de JS y CSS
Bueno, en este tema no me voy a meter mucho porque he escrito hace relativamente poco tiempo un post MUY largo sobre este tema.
Si quieres saber cómo optimizar el Javascript y el CSS en WordPress, puedes ver el siguiente post:
La sección “Optimizar archivos” de WP Rocket te da la oportunidad de ajustar ciertas cosas relacionadas con el javascript y el CSS.
WP Rocket ha cambiado bastante en esta sección en el último año y han metido cosas muy interesantes, como la posibilidad de eliminar jQuery Migrate y la de cargar jQuery de forma asíncrona.
Aquí no existe una configuración exacta que puedas aplicar, ya que depende del theme o plantilla que utilices en tu proyecto web.
Además, esta es una parte donde si pedimos ayuda al soporte de WP Rocket, siempre que no les pidas cosas raras, van a ayudarte a ajustar la configuración.
Pero voy a darte algunos “tips” que te pueden ayudar a realizar una configuración conservadora:
Minificar HTML no suele dar problemas, por lo que puedes marcarlo.
Suprimir los query string de los recursos estáticos debes marcarlo siempre.
Optimizar la entrega del CSS va a ayudarte bastante y no suele dar problemas, por lo que puedes marcarlo.
Eliminar jQuery Migrate deberías marcarlo. Solo te va a dar error si tienes algún plugin sin actualizar que utilice una versión antigua de jQuery.
Además, puedes probar la opción “Cargar archivos Javascript de manera diferida”, pero va a depender de los plugins y el theme que utilices.
Recuerda, si quieres más información sobre esto puedes consultar mi post:
Algunos ajustes con WP Rocket
Ahora vamos a hablar de otros tweaks y cosillas de WordPress que podemos ajustar utilizando WP Rocket.
Hay unas cuantas secciones más de WP Rocket con funcionalidades varias que puedes utilizar para darle unas cuantas vueltas a la tuerca. Por ejemplo, la carga de imágenes mediante “Lazy Load” o la desactivación de ciertas cosas como los emojis o el oembd.
Vamos a empezar por la sección “Medios” e ir bajando.
Sección “Medios” de WP Rocket
La sección “Medios” tiene algunas cosas interesantes para ajustar en WordPress.
La primera sección es “LazyLoad”. Por si no la conoces, es una funcionalidad que normalmente se implementa mediante javascript y que permite cargar las imágenes cuando se va haciendo scroll por la página. Por tanto, no se cargan todas las imágenes de la página de golpe, sino solo una vez se necesitan. Desde hace poco tiempo, Google Chrome incluye Lazy Load nativo, por lo que nos ahorraremos la petición JS de LazyLoad.
Como puedes ver en la imagen anterior, WP Rocket también permite hacer Lazy Load de los vídeos de Youtube e incluso poner una foto pre-vídeo para no cargar todos los recursos de Youtube hasta que el usuario haga clic para ver el vídeo.
WP Rocket también puede desactivar los emojis. Si no los utilizas, es una buena forma de tener una petición menos en tu sitio web. También nos permite desactivar el oEmbd o el contenido incrustado, que en pocas ocasiones se utilizan, otra buena forma de ahorrar otra petición HTTP. Yo te recomiendo marcar estas dos opciones para desactivar emojis y contenido incrustado.
Por último, en esta sección podemos activar la compatibilidad con WebP, es decir, WordPress servirá imágenes WebP siempre que estén disponibles y que el navegador del visitante sea compatible. El problema es que para esto vas a necesitar complementar WP Rocket con el plugin de optimización de imágenes Imagify de los mismos desarrolladores.
Sección “HEARTBEAT” de WP Rocket
Como siempre digo, el API Heartbeat es una de las ventajas de WordPress, pero también puede ser uno de los problemas más importantes que tenga un WordPress para el WPO.
Desde la versión 3.3 de WP Rocket, más o menos, se incluye gestión del API Heartbeat. Lo ideal es marcar “Controlar Heartbeat” y marcar en los tres casos “Reducir actividad” para que ejecute los pulsos cada 2 minutos en lugar de cada 15 segundos, que es lo nativo de WordPress.
Sección “ADD-ON” de WP Rocket
En la sección “Add-On” de WP Rocket tenemos algunas opciones interesantes, pero solo vamos a centrarnos en dos.
Google Tracking: Si lo activamos, nos permite guardar en local el archivo JS de Google Analytics y eso hace que le podamos especificar “cache de navegador”.
Facebook Pixel: Exactamente lo mismo que lo anterior. Guarda el JS de Facebook Pixel en local para poder especificarle “cache de navegador”.
Estas dos cosas son necesarias porque en muchos casos son los ÚNICOS dos archivos detectados por Google PageSpeed Insights y GTMetrix como que tienen los valores de cache de navegador sin ajustar.
Como he dicho, en esta sección podemos encontrar varias opciones más:
La integración de WP Rocket con Varnish, para que pueda ser vaciado el cache de Varnish desde el panel de control de WordPress como ocurre cuando detecta el OPCache.
La integración con CloudFlare como CDN y optimizador, que nos permite también vaciar cache de CloudFlare automáticamente y desde el panel de control. Así conseguimos que tanto WP Rocket como CloudFlare se sincronicen perfectamente.
La integración con el proxy de Sucuri, que realiza más o menos lo mismo que la integración de CloudFlare.
Cada una de estas opciones tiene una “sub-configuración”, como puedes ver en este caso la integración con CloudFlare:
En cualquier caso, la configuración depende del proyecto.
Limpieza de la DB con WP Rocket
Desde hace bastantes versiones de WP Rocket, este incluye una herramienta para limpiar la DB de WordPress. Como escribí en un post hace algún tiempo, la DB es una de las partes más importantes de WordPress. Con el tiempo va “ensuciándose” y es necesario hacerle un mantenimiento.
No es la herramienta más avanzada del mundo, pero permite la limpieza automática de elementos que ocupan espacio en la DB como las revisiones antiguas, los borradores antiguos, los comentarios SPAM y los transients.
Si necesitas una herramienta más avanzada, puedes consultar el post sobre la DB MySQL o MariaDB de WordPress que he publicado en este blog.
Tweaks para WP Rocket
En el sitio web oficial de WP Rocket existen algunos tweaks que podemos utilizar para modificar el funcionamiento de WP Rocket o para solucionar algunos problemas importantes que aún tiene el plugin. Por ejemplo, un “fallo” de slash que existe desde hace muchas versiones.
La mayoría de los tweaks que existen se implementan e instalan mediante un plugin añadido.
¿Cuál es la razón por la que WP Rocket no incluye todo esto en el propio plugin? Pues supongo que para no hacerlo más complejo, ya que uno de sus puntos fuertes es la facilidad de configuración y la simplicidad de su interfaz.
Yo aquí solo voy a listar algunos que son útiles para mí, pero existen muchos más tweaks que puedes encontrar aquí: https://docs.wp-rocket.me/
Desactivar el cache de WP Rocket
Como he dicho al principio, el cache en WP Rocket se activa automáticamente cuando activamos el plugin.
Existen casos en los que podemos necesitar desactivar ese cache, ya que por la razón que sea queremos utilizar otras funcionalidades de WP Rocket pero NO el cache.
En ese caso, podemos hacerlo instalando este plugin que podemos encontrar para descargar en la documentación de WP Rocket: https://docs.wp-rocket.me/article/61-disable-page-caching
Forzar la actualización de WP Rocket
WP Rocket recibe actualizaciones constantes. Es raro el mes en que no se actualiza una u dos veces.
Es muy importante actualizar el plugin porque suelen solucionar problemas de estabilidad o funcionamiento y también añadir nuevas funcionalidades.
En caso de que por alguna razón no aparezca el mensaje de actualización, podemos forzarla.
Para ello, debemos utilizar el siguiente query string en la URL:
http://example.com/wp-admin/plugins.php?rocket_force_update=1
1
http://example.com/wp-admin/plugins.php?rocket_force_update=1
Evidentemente, debes cambiar el dominio por el de tu web.
Esto me ocurre bastantes veces cuando instalo una versión antigua de WP Rocket y tengo que forzar para que se actualice, ya que a veces tarda unos minutos y yo necesito que se actualice YA.
Servir cache mobile a tablets con WP Rocket
Normalmente, los plugins para WordPress distinguen 3 tipos de “tamaños de pantalla”: Mobile, Tablet y Desktop.
Si por alguna razón tenemos una versión para móviles y otra para ordenadores y queremos que las tablets sean tratadas como móviles, debemos instalar el siguiente plugin que podemos encontrar en la documentación de WP Rocket: https://docs.wp-rocket.me/article/708-mobile-caching
Modificar los periodos de Preload Cache
Como he dicho antes, el pre-cache o Preload es una de las funcionalidades más interesantes de WP Rocket, ya que la han ido mejorando poco a poco hasta conseguir lo que actualmente existe y que consigue que tengamos un cache eficiente.
Normalmente, en los plugins de cache que implementan esta funcionalidad podemos modificar el tiempo de espera entre páginas. Sin embargo, en WP Rocket lo simplifican tanto que para hacer esto necesitamos instalar un plugin simple que encontraremos en su documentación: https://docs.wp-rocket.me/article/8-how-the-cache-is-preloaded#crawl-interval
Modificar el cache de usuario para que sea común
Como he dicho al principio del post, de forma nativa cuando marcamos la casilla “Habilitar la cache para los usuarios conectados a WordPress” lo que se hace es que se crea una cache específica para cada usuario conectado.
Si queremos que esta cache sea común para todos los usuarios y realmente se mejore el desempeño, tenemos que instalar un mini plugin que podemos encontrar en la documentación de WP Rocket: https://docs.wp-rocket.me/article/313-user-cache
Además, podemos desactivar el cache para los administradores: https://docs.wp-rocket.me/article/919-disable-cache-for-logged-in-administrators
Limpiar cache de WP Rocket desde CRON
Si por alguna razón el WP-CRON no te funciona y necesitas forzar la limpieza de cache desde el CRON de Linux, también puedes hacerlo. Desde WP Rocket nos proporcionan la documentación necesaria para configurar esta tarea programada.
Podemos encontrar las instrucciones y el código necesario aquí: https://docs.wp-rocket.me/article/494-how-to-clear-cache-via-cron-job
Desactivar la limpieza de cache de WP Rocket
Si especificamos 0 en el tiempo de limpieza de cache, desactivaremos la limpieza periódica de cache de WP Rocket.
Pero si queremos desactivar POR COMPLETO las políticas de vaciado de cache, podemos hacerlo utilizando otro plugin que encontraremos en la documentación de WP Rocket: https://docs.wp-rocket.me/article/137-disable-automatic-cache-clearing
Con esto desactivaremos POR COMPLETO el vaciado de cache y solo lo podremos vaciar pulsando el botón “Borrar cache”, es decir, no se borrará ni al publicar un post, ni al editar, ni con los comentarios, etc.
Modificar el lugar de guardado de cache de WP Rocket
Como he dicho varias veces en este post, WP Rocket solo realiza cache en disco.
Podemos modificar las rutas de las carpetas donde WP Rocket guarda el cache, pero no podremos hacerlo desde la interfaz.
Para modificar estas rutas debemos modificar algunos parámetros añadidos en el wp-config.php.
Podemos encontrar más información aquí: https://docs.wp-rocket.me/article/1118-specify-a-custom-cache-folder
Desactivar el generar la ruta crítica de CSS
De forma nativa, aunque no configuremos nada en la parte de optimización de código, WP Rocket nos generara la ruta crítica de CSS o Fallback Critical CSS.
En caso de que utilicemos otro plugin para realizar esta tarea, podemos desactivar esta funcionalidad con un plugin que podemos encontrar en la documentación: https://docs.wp-rocket.me/article/1266-optimize-css-delivery
Activar el LazyLoad nativo de Google Chrome
En la versión 76 de Google Chrome se implementó la funcionalidad de LazyLoad nativo, lo que mejora bastante la eficiencia de esta funcionalidad al “ahorrarnos” la ejecución de un javascript.
En la versión 3.5.2 de WP Rocket al menos no habían incluido esta funcionalidad, pero se puede activar con este plugin que podemos encontrar en su documentación en esta URL: https://docs.wp-rocket.me/article/1292-chrome-native-lazyload
Esperemos que esta funcionalidad la podamos encontrar en breves en el propio plugin, tal y como ocurre con Perfmatters.
Solucionar problemas de cache con SLASH
En algunos casos y desde hace bastantes versiones, WP Rocket tiene problemas de cache con / y sin / (es decir, slash).
Estos problemas pueden ser muy graves para el SEO de un sitio web ya que, si la web carga de las dos formas, Google lo puede ver como contenido duplicado.
Podemos solucionar ese problema con este plugin que podemos encontrar en la documentación, aunque también está disponible un código para el .htaccess: https://docs.wp-rocket.me/article/131-redirection-to-enforce-trailing-slash-on-urls
Cachear los resultados de búsqueda con WP Rocket
En sitios web muy grandes y con mucho contenido (y también con mucho tráfico) puede ser necesario cachear los resultados de búsqueda para evitar problemas.
Podemos hacerlo con un plugin que podemos encontrar en la documentación de WP Rocket: https://docs.wp-rocket.me/article/29-caching-the-search-page-result