WP Rocket es uno de los mejores plugin de caché, con el que podrás optimizar la velocidad de carga de tu página web de una manera rápida y fácil.
Vamos a descargar, instalar y configurar WP Rocket.
Descargar e instalar WP Rocket
Lo primero que tienes que hacer es dirigirte a la página de wp rocket y elegir el plan que mejor se adapte a tus necesidades.
Conseguir WP Rocket ahora
Una vez que hayas completado tu pedido, en tu cuenta encontrarás un botón que pone >download wp rocket. Haz clic en él para descargar el plugin.
Ahora vamos a WordPress > Plugins > Agregar plugin y subimos nuestro archivo wp-rocket.zip.
Ya está listo para configurar.
Configuración del caché
- Caché móvil
Cachea tu web en dispositivos móviles. Habilitar - Caché para dispositivos móviles
Habilitar - Guardar separadamente los archivos para dispositivos móviles
Esta última opción se utilizará si tienes un tema o plugin específico para dispositivos móviles.
Habilitar. - Caché de usuario
Si tienes usuarios registrados en tu sitio web (membresía), deberías activar esta casilla. - Vida útil de la caché
Establecemos la vida útil del caché a 24 h.
Cada 24 h los archivos de caché se eliminarán.
Si habilitas la precarga del caché, se generan automáticamente después de ser eliminados.
Con una baja publicación de contenido, podemos aumentar la vida útil de la caché.
Optimizar archivos CSS y JavaScript
Aquí podrás configurar la optimización de los archivos CSS y JavaScript para mejorar la carga de tu página web.
CSS
- Minificar archivos CSS
Activaremos esta opción para reducir el tamaño (peso) de los archivos CSS de nuestro sitio web. - Combinar archivos CSS
Junta todos los archivos CSS en uno solo.
Si tu hosting utiliza HTTP/2 puedes dejarla deshabilitada.
Si la activas, deberás estar atento a los problemas que pueda generar. - Excluir los archivos CSS
Si falla algo en tu sitio web que dependa de un archivo CSS, aquí puedes excluir ese archivo. - Optimizar la entrega del CSS
Elimina el CSS que bloquea la renderización de tu página web. - – Remove unused CSS (BETA).
Elimina los archivos CSS que WP-Rocket cree que no están siendo utilizados.
Esta opción a día de hoy está en fase de prueba.
– Load CSS ASYNCHRONOUSLY
Genera el CSS de ruta crítica y carga el CSS de forma asíncrona.
Wp Rocket “Recomendamos eliminar el CSS no utilizado como método de optimización del CSS. Cargar CSS de forma asíncrona solo debe utilizarse si hay un problema con eliminar CSS no utilizado».
Recordar que Load CSS ASYNCHRONOUSLY no puede activarse al mismo tiempo que Remove unused CSS.
Resumiendo, habilitamos Remove unused y si nos da algún problema lo sustituimos por Load cs asynchronously.
JavaScript
- Minificar archivos JavaScript
Elimina los espacios blancos y los comentarios para reducir el tamaño de archivo. - Combinar los archivos Javascript
Combina los archivos JavaScript, reduciendo las peticiones HTTPS.
Si tu sitio web utiliza HTTP2, no habilitar. - Excluir archivos JavaScript
Aquí es donde pondrás los archivos JS que quieres excluir de la minificación y la concatenación (un archivo por línea). - Cargar archivos JavaScript de manera diferida
Esta opción impedirá que la carga de los archivos JavaScript bloquee el navegador (renderizado).
Si algún archivo JS nos genera un error lo podemos excluir.
Opción incompatible con combinar archivos JavaScript. - Retrasar la ejecución de JavaScript
Retrasa la carga de los archivos JavaScript hasta que el usuario realice una acción. - Excluir archivos JavaScript
Donde incluyes los archivos que no quieres retrasar.
Medios
- Habilitar para las imágenes
Cargará todas las imágenes de la parte que el usuario ve cuando accede a nuestra página sin utilizar el scroll (Above the Fold).
Cuando el visitante se desplaza por la página irá cargando y mostrando las imágenes.
Esto reduce la cantidad de solicitudes HTTP y mejora el tiempo de carga de la página - Habilitar para iframes y videos
Lo mismo que el apartado anterior, pero en este caso para iframes y videos.
Habilitar si la página los tiene. - Excluir imágenes y vídeos
Si quieres excluir alguna imagen o video, este es el lugar. - Image Dimensions
Añade los atributos de anchura y altura que falten en las imágenes.
Es importante que las imágenes lleven estos atributos, ya que mejora la carga de la página web.
Si quieres saber más sobre optimización de imágenes te puede interesar este artículo: optimiza tus imágenes con Imagify.
Precarga
Funcionamiento básico del caché
Cuando visitas una página web, WordPress hace una consulta a la base de datos por medio de php y genera una página web HTML como respuesta.
Cada vez que visitan una página web se realiza este proceso.
Cuando activas el caché, este proceso solo se realiza la primera vez que un usuario visita una página.
Al próximo usuario que acceda a esa página, WordPress le enviará la página almacenada en vez de generarla otra vez.
Con el precache, no saltamos este paso y WP Rocket cacheará de manera automática todas las páginas antes de que sean visitadas.
Precarga Caché
- Activar la precarga
- Activar la función de precarga de caché a través del mapa del sitio.
- Mapa del sitio XML de Yoast SEO
Detecta automáticamente si tienes instalado el plugin y te da la opción de precargar tu sitio a través del mapa de Yoast SEO.
Si lo tienes, habilítalo. - Mapas del sitio para precargar
Especifica qué mapas del sitio quieres usar para la precarga.
Precarga Enlaces
Mejora el tiempo de carga al descargar una página por medio de un enlace en tu sitio web.
Si un usuario pasa por encima de un enlace o lo toca durante 100 ms o más, el HTML de esa página se obtendrá en segundo plano, de modo que cuando se haga clic en el enlace, la página se cargará instantáneamente.
Precarga de peticiones DNS
Mejora la carga de archivos externos.
- URLs para precargar
Si tienes contenido de terceros, los navegadores anticiparán sus solicitudes a esas fuentes externas antes de que hayan sido requeridas por el usuario y de esta manera, las tendrá listas para cuando sea necesario utilizarlas.
Si utilizas google fonts en línea deberías añadir: //fonts.googleappis.com - Precargar Fonts
Mejora el rendimiento del navegador y con ello, velocidad de carga del sitio web.
El navegador comenzará a descargar las fuentes de tu sitio web, que de otro modo no descubriría hasta mucho más tarde, cuando fueran a ser utilizadas.
Las fuentes que vas a emplear en tu proyecto las debes añadir aquí.
Tienen que estar alojadas en tu dominio y has de añadir una por línea.
- URLs para precargar
Reglas Avanzadas
- Nunca poner en caché estas URLs
Excluir URLs que no queremos que sean cacheadas. - Nunca poner en caché estas Cookies
Excluir Cookies que no queremos que sean cacheadas. - Nunca poner en caché estos agentes de usuario
Excluir que diferentes agentes de usuarios (navegadores) no puedan acceder a las páginas de caché. - Purgar siempre estas URLs
Cuando actualizas una entrada o página, la caché se borra solo para esa entrada o página.
Si hay contenido relacionado que no se actualiza (un listado de entradas de un blog, por ejemplo) puedes utilizar esta función, especificando lo que quieres que se purgue siempre. - Poner en caché estos query string
Permite cachear URLs que tengan parámetro.
Por defecto no lo permite.
Base de Datos
Opciones para optimizar la base de datos de WordPress
- Limpieza de datos
Elimina las revisiones, los borradores y entradas descartadas de forma permanente. - Limpieza de comentarios
Elimina los comentarios enviados al spam y los descartados. - Limpieza de transients
Los transients son los datos temporales.
Elimina los datos expirados y todos los trasients. - Limpieza de la Base de Datos
Elimina los datos obsoletos y optimiza las tablas. - Automatic Cleanup
Realiza la optimización de la base de datos según nuestra configuración de forma automática.
CDN (Content Delivery Network)
Son un grupo de servidores distribuidos geográficamente que trabajan juntos para ofrecer de una forma rápida la entrega de contenido en internet.
- Habilitar el Content Delivery Network
Si utilizamos CDN activamos esta opción. - Excluir archivos del CDN
Añade los archivos que no quieras que sirvan
HeartBeat
Heartbeat realiza varias funciones como autoguardado en el editor de entradas, notificaciones en el panel de administración de WordPress (backend), etc.
Estas funciones las realiza en un intervalo de tiempo 15-60 segundos.
- Control Heartbeat: Activado
- Reduce o desactiva la actividad de Heartbeat
Reducimos la actividad de backend, editor de entradas y frontend.
No es recomendable desactivar, puede provocar problemas.
Add-on
Diferentes adds que te ayudarán a mejorar tu velocidad y que no necesitan ninguna configuración.
Solo tienes que activar las que utilices.
Herramientas
Herramientas que te facilitan la administración de wp-rocket.
- Exportar ajustes
Descarga la configuración de tu WP Rocket en un archivo. - Importar ajustes
Carga una configuración de WP Rocket desde un archivo. - Rollback: Vuelve a una versión anterior. Puedes utilizar esta opción si tu versión actual te está generando algún problema.
Antes y después con WP Rocket
Una buena optimización web se debe a múltiples factores (discos ssd, protocolo http2, compresión gzip, optimización del código e imágenes, tema que utilizas…) y uno de ellos es la memoria caché.
Con WP Rocket podrás optimizar la memoria caché y algún otro factor, como has podido ver en este artículo.