¿Qué es el control de caché? | La caché explicada

¿Qué es el control de caché?

El control de caché Cache-control es una encabezado HTTP que dicta el comportamiento de la caché del navegador. En pocas palabras, cuando alguien visita un sitio web, su navegador guarda ciertos recursos, como imágenes y datos del sitio web, en un almacén conocido como caché. Cuando ese usuario vuelve a visitar el mismo sitio web, el control de caché establece las reglas que determinan si esos recursos se cargarán desde su caché local, o si el navegador tendrá que enviar una solicitud al servidor para conseguir recursos nuevos. Para entender mejor el control de la caché, se requiere una comprensión básica del almacenamiento en caché del navegador y de los encabezados HTTP.

¿Qué es el almacenamiento en caché del navegador?

Como ya se ha explicado, el almacenamiento en caché del navegador consiste en guardar los recursos del sitio web para no tener que recuperarlos de nuevo de un servidor. Por ejemplo, se puede guardar en local en la caché una imagen de fondo de un sitio web para que cuando un usuario visite esa página por segunda vez, la imagen se cargue desde los archivos locales del usuario y la página se cargue mucho más rápido.

Los navegadores solo almacenan estos recursos durante un periodo de tiempo determinado, lo que se conoce como Tiempo de vida (TTL). Si un usuario solicita un recurso almacenado en caché después de que haya caducado el TTL, el navegador tendrá que volver a contactar con el servidor y descargar una nueva copia del recurso. ¿Cómo saben los navegadores y los servidores web el TTL de cada recurso? Aquí es donde entran en juego los encabezados HTTP.

¿Qué son los encabezados HTTP?

El Protocolo de transferencia de hipertexto (HTTP) esboza la sintaxis de las comunicaciones en la World Wide Web, y esta comunicación consiste en solicitudes de los clientes a los servidores y respuestas de los servidores a los clientes. Cada una de estas solicitudes y respuestas HTTP viene acompañada de una serie de pares clave-valor conocidos como encabezados.

Estas encabezados contienen mucha información importante sobre cada comunicación. Por ejemplo, un encabezado de solicitud suele incluir:

1. Información sobre el recurso que se solicita
2. Qué navegador usa el cliente
3. Qué formatos de datos aceptará el cliente

Los encabezados de las respuestas suelen incluir información sobre:

1. Si la solicitud se ha realizado con éxito o no
2. El lenguaje y el formato de cualquier recurso en el cuerpo de la respuesta.

Un encabezado de control de caché puede aparecer tanto en las solicitudes como en las respuestas HTTP.

¿Qué hay en un encabezado de control de caché?

Los encabezados se componen de pares clave-valor separados por dos puntos. Para el control de caché, la 'clave', o la parte a la izquierda de los dos puntos, es siempre 'control de caché'. El 'valor' es lo que se encuentra a la derecha de los dos puntos, y puede haber uno o varios valores separados por comas para el control de caché.

Estos valores se denominan directivas, y dictan quién puede almacenar en caché un recurso, así como el tiempo que esos recursos pueden ser almacenados en caché antes de que haya que actualizarlos. A continuación, repasamos algunas de las directivas de control de caché más comunes:

cache-control: private

Una respuesta con una directiva "private" solo la puede almacenar en caché el cliente y nunca un agente intermediario, como una CDN o un proxy. A menudo se trata de recursos que contienen datos privados, como un sitio web que muestra la información personal de un usuario.

cache-control: public

En cambio, la directiva "public" significa que el recurso lo puede almacenar cualquier caché.

Cache-Control: no-store

Una respuesta con una directiva 'no-store' no puede ser almacenada en caché en ningún lugar, nunca. Esto significa que cada vez que un usuario solicita estos datos, debe enviarse una solicitud al servidor de origen para obtener una copia nueva. Esta directiva suele reservarse para los recursos que contienen datos extremadamente confidenciales, como la información de cuentas bancarias.

cache-control: no-cache

Esta directiva significa que las versiones en caché del recurso solicitado no pueden utilizarse sin comprobar primero si existe una versión actualizada. Esto se hace normalmente con una ETag.

Una ETag es otro encabezado HTTP que contiene un token único para la versión del recurso en el momento en que se solicitó. Este token se cambia en el servidor de origen cada vez que se actualiza el recurso.

Cuando un usuario vuelve a una página con un recurso "no-cache", el cliente siempre tendrá que conectarse al servidor de origen y comparar la ETag del recurso en caché con la del servidor. Si las ETags son idénticas, el recurso almacenado en caché se ofrecerá al usuario. Si no es así, significa que el recurso ha sido actualizado y el cliente tendrá que descargar una nueva versión para ofrecérsela al usuario. Este proceso garantiza que el usuario siempre reciba la versión más actualizada de ese recurso sin necesidad de realizar descargas innecesarias.

cache-control: max-age

Esta directiva dicta el tiempo de vida, es decir, cuántos segundos se puede servir un recurso desde la caché después de haberlo descargado. Por ejemplo, si la max age se establece en 1800, esto significa que durante 1800 segundos (30 minutos) después de que el recurso haya sido solicitado por primera vez desde el servidor, al usuario se le servirá una versión en caché de ese recurso en las siguientes solicitudes. Si el usuario vuelve a solicitar el recurso una vez transcurridos esos 30 minutos, el cliente tendrá que solicitar una copia nueva al servidor de origen.

cache-control: s-maxage

La directiva 's-maxage' es específica para las cachés compartidas, como las CDN, y dicta el tiempo que esas cachés compartidas pueden seguir sirviendo el recurso desde la caché. Esta directiva anula la directiva 'max-age' para los clientes individuales.

¿Por qué es importante el control de caché?

El almacenamiento en caché del navegador es una excelente manera de preservar los recursos y mejorar la experiencia del usuario en Internet, pero sin el control de caché sería muy frágil. Todos los recursos de cada sitio estarían sujetos a las mismas reglas de almacenamiento en caché, lo que significa que la información confidencial se almacenaría en caché de la misma manera que la información pública, y los recursos que se actualizan con frecuencia se almacenarían en caché durante el mismo tiempo que los que rara vez cambian.

El control de caché añade la flexibilidad que hace que el almacenamiento en caché del navegador sea realmente útil, lo cual permite que los desarrolladores dicten cómo se almacenará cada recurso en caché. También permite que los desarrolladores establezcan reglas especiales para los intermediarios, lo cual es un factor que explica por qué los sitios que utilizan una CDN, como la CDN de Cloudflare, suelen tener un mejor rendimiento que los sitios que no la utilizan.