La cache es una seria de funciones que mejoran el acceso a la información evitando generar un contenido repetidamente almacenándolo para que se pueda acceder de forma rápida. Esta técnica solo debe usarse cuando el contenido no es importante que este actualizado por que pueden darse situaciones en las que un usuario este viendo una versión no actualizada.
Diferentes tipos de cache
- El cache de navegador es la que tienen los navegadores y que hace que las webs caguen más rápido guardando parte de la información estática como CSS y HTML.
- La cache del servidor es aquella que nos permite mostrar una web con contenido dinámico de forma rápida almacenándola en el servidor como contenido estático.
- En el desarrollo de WordPress podemos hacer referencia a los elementos transitorios, que permiten establecer variables con un tiempo determinado y una vez transcurrido se vuelven a calcular.
- Almacenamiento en cache de Mysql permite guardar consultas repetitivas en memoria. Personalmente no he usado nunca este tipo de cache.
Motivos por los que usar la cache
- Para los clientes: Internet es un mundo lleno de oportunidades, pero para todos, esto quiere decir que hay mucha competencia. Además, cada vez se usa más el móvil para acceder ya que tenemos mucho tiempo muerto con el mismo en la mano (En el metro, en la calle, en la cama, etc). Si unimos competencia + móvil, podemos entender que no hacer esperar a nuestros potenciales clientes es muy importante.
- Para los buscadores: Los buscadores como Google buscan ofrecer los mejores resultados a sus clientes, y saben que un usuario tiene poca paciencia, por tanto valoran que las webs sean rápidas. Por este motivo existen herramientas para medir y mejorar la velocidad de nuestra web:
Plugin WP Super cache
Es uno de los plugins de cache más descargados (creo que el más) del mundo WordPress, y eso es en cierto modo una garantía. Y es gratuito. De todos modos, cuando recomiendo un plugin me gusta dejar claro que es algo circunstancial ya que puede que en unos días, semanas o meses cambie la percepción del mismo (por que mejore, o por que salga otro mejor) y del proyecto, hay plugins que se pegan entre si y en cada sitio tienes unos que pueden hacer que este plugin de errores.
Vamos a revisar su configuración:
- La primera pestaña es Fácil y en ella simplemente podemos activar la cache y nos dan una serie de consejos para poder mejorar la velocidad de nuestro sitio. También podemos borrar la cache.
- Avanzado: Permite mejorar el cacheo ganando velocidad por ejemplo permite el cacheo mediante mod_rewrite que es más rápido, pero solo recomendado para contenido que sepamos que no es fundamental. Método de entrega de caché => Experto. Podemos indicar si queremos cachear la información a los usuarios logueados, cuando queremos que se actualice la cache (cuando haya comentarios nuevos, con cada nueva entrada, etc.) y podemos establecer el tiempo de duración de la cache (Es decir, si un usuario cachea hoy la página hasta cuando no debe actualizarse esa página).
- CDN: Consiste en servir el contenido de nuestro sitio desde diferentes sitios. Por ejemplo, podemos cargar las imágenes, CSS o JS desde un subdominio haciendo que la carga sea más rápida ya que cada sitio tiene una capacidad de carga.
- Contenidos: Es una pestaña resumen.
- Precarga: Si instalamos el plugin ya teniendo entradas podemos pre cachearlas para que los usuarios o buscadores se encuentren con la versión en cache, sino habría que esperar a que alguien la pida y se cachee.
Plugin autoptimize
No es un plugin exclusivamente de cacheo sino de mejora de velocidad con el que he conseguido muy buenos resultados en algunos proyectos. Veamos sus opciones (Despliega todas las opciones avanzadas):
- Opciones de HTML: Lo que hace es minificar el html, vamos quita espacios en blanco y hace que el html ocupe el mínimo de líneas posible, esto reduce mucho el tamaño de las páginas aumentando MUCHO su velocidad de descarga. También quita los comentarios y aunque hay un check para mantenerlos no se me ocurre ningún caso en el que debas activarlo.
- Opciones de JavaScript: La única opción que debes activar es: JS optimizado (lo minimiza), el resto de opciones sirven por si hay errores con alguna funcionalidad que se necesita ejecutar en el Header. El input Scripts a excluir de Autoptimize es muy interesante porque te permite indicarle que un JS no lo minimize evitando errores con JS que se rompen al minimificarlo. Esto es frecuente, y esta no es la mejor medida… pero es mejor que nada. Lo ideal sería ver porque da ese error (usando DevTools) y corregirlo.
- Opciones de CSS: El funcionamiento es igual que con los JS. La principal diferencia es que permite combinar todos los CSS en 1 solo. Aquí me gustaría puntualizar en que es mejor:
- Lo ideal sería mostrar 1 único css con el estilo exclusivo de la página que estamos viendo.
- En los CMSs (entre ellos WordPress) es muy difícil ya que se elaborar temas estándar para diferentes sitios, y no se puede saber en qué páginas se usaran los estilos. La única opción sería crear un theme a medida (de nuevo lo barato sale caro) y sino mostrar el CSS en un único fichero.
- Esta última opción puede hacer que tengamos un CSS muy grande con lo que bloquee la carga del sitio, en este caso habría que intentar separarlo en varios: 1 el css clave y el secundario, y cargar el primero en línea y el segundo en 1 css pero de forma asyncrona.
- Opciones de la CDN: Con esta opción podemos cargar el js, css e imágenes desde otro servidor.
- Información de la caché: Viene instalada por defecto, y junto al resto de opciones hacen un gran conjunto.
- Otras opciones: Debemos activar las opciones a no ser que no funcione algo en nuestro sitio.