CMS Servidores

Qué es la memoria caché: ¡Mi web no muestra los cambios que realizo!

Diario Marca en 1999 -Caché de Internet Web Archive

Memoria caché: Para qué sirve, cómo activarla/desactivarla y cómo acceder a los archivos cacheados

En más de una ocasión, como desarrollador web, te habrá pasado que realizas un cambio, pongamos en un script, lo subes a la red y… ¡tachán! ¡No funciona! ¡¡Pero si en local sí que funcionaba!!

O, como usuario web, puede que hayas notado que la primera vez que accedes a una página, ésta tarda mucho más en cargar que los accesos posteriores que realices.

En ambos casos, la explicación es la misma: La memoria caché te ha ayudado a aligerar la carga (en el segundo ejemplo), pero  evita que veas las nuevas versiones de una página (en el primer ejemplo).

En el siguiente post, vamos a explicarte qué es exactamente la memoria caché, cómo evitar que te pase lo del primer caso, y cómo poder borrarla, implementarla e incluso, cómo acceder a los archivos cacheados.


¿Tienes prisa?

Cuando accedemos a una página, nuestro navegador descarga e interpreta todo el contenido de la misma: Imágenes, vídeos, tipografías, scripts… De manera que cuando volvamos a acceder un tiempo después, notaremos que la velocidad de carga es sensiblemente menor.

La memoria caché, es la que se encarga de esto, y su propósito es agilizar las velocidades de carga y respuesta.

Por defecto, todos los navegadores la tienen implementada, creando así un doble beneficio:

  1. Las páginas que visites habitualmente se cargarán mucho más rápido.
  2. Como no cargas todo el contenido íntegro de la web, la carga de tráfico en el servidor, es menor.

La memoria caché no sólo puede estar en tu navegador, sino que muchas webs la utilizan del lado del servidor para evitar que tráficos muy altos hagan caer la web o la relenticen con demasiadas peticiones idénticas.

Por ejemplo: Si nos fijamos en algunos importantes diarios como Marca, El Mundo, El País, La Razón… Vemos que las páginas ampliadas de las noticias, se muestran con la extensión “.html”. Esto se debe a que su sistema de caché crea una página estática que sirve a los usuarios. Si no lo hiciesen así, cada vez que una persona acceda a una noticia, además de cargar todo el contenido estático, tendría que esperar las respuestas de las consultas realizadas a la base de datos, relentizando así servidor y carga de la web. A fin de cuentas, si la noticia siempre es la misma, ¿Qué sentido tiene cargarla desde la base de datos una y otra vez?

Pero los sistemas de caché también tienen su reverso tenebroso… ¿Qué ocurre si realizo una pequeña modificación en una página cacheada? Si la página editada no se descachea o fuerza al navegador a renovarla, ese cambio no se mostrará hasta que la caché expire, y eso pueden ser días.

Por otro lado, si todo lo que visualizamos en el navegador, ha sido descargado a nuestro ordenador, ¿No puede esto ocasionar que nos quedemos sin espacio en el ordenador?

En la ampliación del artículo te explicamos cómo saber la memoria que está ocupando la caché de navegador en tu disco duro, cómo borrarla, cómo reducirle la cuota, cómo instalar una caché en el servidor, etc

Pasa, siéntate, aprende, ¡Y disfruta!

 

 

Desarrolladores: Caché de servidor – Sistemas para cachear una web

Aunque en local nuestros navegadores tienen la sana costumbre de cachear todas las páginas que visitamos, es una buena idea cachear nuestra web del lado de servidor, especialmente en aquellos casos en los que nuestras entradas o páginas no sean modificadas diariamente.

Una tendencia bastante habitual, es no cachear la portada de una web, pero sí las secciones fijas y las noticias antiguas. De esa forma, nos aseguramos de que no haya problemas a la hora de mostrar los últimos contenidos publicados, pero los antiguos que ya han sido más que revisados y perfeccionados, permanecen en webs estáticas que no precisan de realizar consultas a la base de datos.

¿Cómo lo hacemos?

a) Si tenemos WordPress

En el caso de WordPress y CMS similares, existen plugins que nos facilitan la tarea. El más popular es W3 Total Caché, y en esta entrada os explicamos cómo descargarlo y configurarlo correctamente: W3 Total Caché – Gana visitas agilizando tu velocidad de carga.

b) Si programamos sin CMS

Podemos servirnos de la función ob_start() para elaborar un sencillo script en PHP que nos permita cachear las páginas a nuestra elección.

Para ello, bastará con seguir el paso a paso de este artículo que hemos creado ex profeso: Programando un sistema de caché en PHP

c) Cachear desde el panel de control:

Finalmente podemos añadir otra capa de caché a través de nuestro panel de control o directamente en nuestro servidor con ssh. Este último paso, complementa a los dos anteriores y se centra  en acelerar la ejecución del propio PHP a través de un software llamado APC Cache.

En este artículo te explicamos cómo instalarlo a través de Plesk y de SSH.

 

Desarrolladores: ¿Cómo evitar que se guarde la caché en una página?

Hasta ahora hemos visto las distintas capas que podemos aplicar para que una web cargue lo más rápidamente posible optimizando la caché a todos los niveles. ¿Pero y si soy un desarrollador que está en pleno proceso de creación de una web? ¿Y si quiero añadir una pequeña modificación a un widget o añadir una funcionalidad nueva? ¿Y si simplemente quiero cambiar un poco la estética o el logotipo de mi página?

Pues todas las capas anteriores, si no están bien configuradas, o están aplicadas de modo muy restrictivo, pueden suponer un problema.

Para solventarlo, más allá de purgar las cachés de cada una de las capas mencionadas (Se explica cómo purgar la caché de cada sistema en los artículos de ampliación correspondientes), podemos añadir unas etiquetas meta que obliguen a una página concreta a renovar la caché o directamente no almacenarla.

Si añadimos esta meta en el <head>, indicamos que la caché de una página concreta, caducó y, por lo tanto, debe renovarla:

Si añadimos esta otra, indicamos que una página en particular no debe ser cacheada:

Si queremos asegurarnos del todo, podemos usar ambas conjuntamente.

 

Usuarios: Gestionar y acceder a la información almacenada en la caché de nuestro ordenador

Como comentábamos, todo lo que visualizamos en el navegador, ha tenido que ser previamente almacenado en nuestro ordenador. Por lo tanto, puede darse la situación de que nos interese recuperar esa canción que tanto nos ha gustado o esa fotografía tan atractiva.

Aunque la manera más sencilla de hacer esto es descargarla directamente desde la web o a través de su código fuente, podemos probar suerte en las carpetas de caché. Y digo probar suerte, porque habitualmente los archivos se guardan con nombres temporales, sin extensión, etc. Por lo que encontrarlos puede ser tarea de titanes, salvo que empleemos un software específico.

Sea como fuere, las rutas de almacenamiento de caché son las siguientes (en caso de que no esté visible alguna de las carpetas, probablemente esté oculta [Ver Cómo mostrar archivos ocultos o de sistema].

 

Windows xp:

  1. Internet Explorer.
    C:\Documents and Settings\Tu_usuario\Configuración local\Archivos temporales de Internet.
  2. Firefox.
    C:\Documents and Settings\Tu_usuario\Configuración local\Datos de programa\Mozilla\Firefox\Profiles\números_y_letras.default\Cache
  3. Safari.
    C:\Documents and Settings\Tu_usuario\Configuración local\Datos de programa\Apple Computer\Safari/cache.db
  4. Chrome
    C:\Documents and Settings\Tu_usuario\Configuración local\Datos de programaGoogle\Chrome\User Data\Default\Cache.
  5. Opera.
    C:\Documents and Settings\Usuario\Datos de programa\Opera\profile\cache4 ó C:\Archivos de programa\Opera\profile\cache4.

 

Windows Vista / Windows 7 / Windows 8:

  1. Internet Explorer.
    C:\Usuarios\Tu_usuario\AppData\Local\Microsoft\Windows\Temporary Internet Files
  1. Firefox.
    C:\Usuarios\Tu_usuario\AppData\Local\\Mozilla\Firefox\Profiles\números_y_letras.default\Cache
  2. Safari.
    C:\Usuarios\Tu_usuario\AppData\Local\Apple Computer\Safari/cache.db
  3. Chrome
    C:\Usuarios\Tu_usuario\AppData\Local\Google\Chrome\User Data\Default\Cache
  4. Opera.
    C:\Usuarios\Tu_usuario\AppData\Local\Opera\profile\cache4 ó C:\Archivos de programa\Opera\profile\cache4.

 

Conociendo las rutas, podemos borrar el contenido de dichas carpetas para renovar la caché, si bien, esa es una manera un poco rebuscada de hacerlo y entraña cierto riesgo de borrar lo que no debemos y cargarnos el explorador.

Por lo tanto, si lo que queremos es borrar los datos de la caché, lo más recomendable es usar la configuración de los navegadores:

 

  1. Internet Explorer.
    Herramientas -> Opciones de Internet o Seguridad- > Historial de exploración
  2. Firefox.
    Menú [3 líneas lineas horizontales situadas en la parte superior derecha] -> Opciones -> Privacidad -> Historial
  1. Safari.
    Menú [Rueda dentada situada en la parte superior derecha] -> Restaurar Safari -> Vaciar Caché
  2. Chrome
    Menú [3 puntos verticales situados en la parte superior derecha] -> Más herramientas -> Borrar datos de navegación
  3. Opera.
    Escribe opera:cache en la barra de direcciones o Menú -> Configuración -> Opciones > Avanzadas > Historial

 

Cualquier duda o discrepancia (suelen variar las rutas dependiendo del Sistema Operativo y la versión del navegador), en los comentarios podemos ayudarte.

 

Nostálgicos: La caché de Google y otros sistemas de arqueología web

Como la caché es un sistema de almacenamiento de las webs que visitamos, y los spiders de los buscadores entran en cientos de miles de páginas al día, éstos han ido almacenando copias de determinadas páginas.

Así pues, usando la caché de los buscadores podemos acceder a versiones antiguas de una determinada página.

¿Antiguas? ¡¿Cuánto de antiguas?!

  • Con Google, por ejemplo, de hace unos días. Lo que nos puede ayudar a recuperar información que hayamos borrado por accidente.

Para ver la caché de una web en Google, basta con buscarla y pulsar en el triángulo inverso que hay junto al enlace:

google_cache

Respecto a Web Archive, basta con acceder a la página y escribir la url. Tras ello nos aparecerá un calendario con los años y días disponibles.

Para ilustrar el ejemplo, hemos buscado la evolución de Facebook:

web_machine

 

evolucion-de-facebook

 

Si te ha resultado útil esta entrada, ¡no olvides compartirla!

 

Cristian Sarabia Martínez

Desde que a principios de los 90 mi padre desempolvó su Spectrum, no he dejado de probar y experimentar con la tecnología.

Enamorado del mundo web, Full Stack Developer de profesión y diseñador por devoción.

Ahora hago mis pinitos en esto del blogging para compartir con vosotros un poquito de todo lo que la comunidad me ha dado.

Escribir comentario

Haz clic aquí para dejar tu comentario