Esta guía explica cómo optimizar el almacenamiento en caché de los recursos web mediante las cabeceras HTTP.

Introducción

• Una buena estrategia de caché permite mejorar significativamente el rendimiento de su sitio web al evitar la retransmisión innecesaria de archivos que no han cambiado.
• La caché web se basa en dos mecanismos complementarios:
  1. El tiempo de validez de la caché (mediante la cabecera Expires), que indica durante cuánto tiempo se puede reutilizar un recurso sin contactar con el servidor.
  2. La validación condicional (mediante las cabeceras Last-Modified/If-Modified-Since), que permite verificar si un recurso ha cambiado antes de volver a descargarlo.

Configuración de la duración del caché con Expires

La cabecera Expires permite especificar un período de tiempo durante el cual el navegador puede reutilizar directamente los recursos desde su caché local. A continuación, se explica cómo configurarla en su archivo .htaccess:

1. Cree o abra el archivo .htaccess en la raíz de su sitio web (generalmente en /web o /sites/domain.xyz).

2. Agregue la configuración del módulo expires:

   <IfModule mod_expires.c>

3. Defina los tiempos de caché adecuados para cada tipo de recurso:

   ExpiresActive On
   ExpiresByType text/html "access plus 1 week"
   ExpiresByType image/jpeg "access plus 1 month"
   ExpiresByType text/css "access plus 1 month"
   ExpiresByType application/javascript "access plus 1 month"

   Estas directivas significan que:

   • Las páginas HTML se almacenarán en caché durante una semana.
   • Las imágenes JPEG, los archivos CSS y JavaScript se conservarán durante un mes.

   Adapte estos tiempos según la frecuencia con la que se actualicen sus recursos.

4. Cierre la sección de configuración:

   </IfModule>

Validación condicional con Last-Modified

Incluso cuando un recurso ha caducado en la caché, no siempre es necesario volver a descargarlo por completo. El mecanismo de validación condicional permite al navegador verificar si su versión en caché sigue siendo actual. Este proceso funciona de la siguiente manera:

1. El servidor envía automáticamente una cabecera Last-Modified con cada recurso, indicando su fecha de última modificación.
   • Apache gestiona esto de forma nativa para los archivos estáticos; no es necesaria ninguna configuración adicional.

2. Cuando el navegador solicita de nuevo el recurso, envía una cabecera If-Modified-Since que contiene la fecha que tiene en caché:

   GET /resource HTTP/1.1
   Host: www.example.com
   If-Modified-Since: Wed, 21 Oct 2015 07:28:00 GMT

3. El servidor compara esta fecha con la fecha real de modificación del archivo:
   • Si el archivo no ha cambiado, simplemente devuelve un código 304 No modificado, lo que permite ahorrar ancho de banda.
   • Si el archivo ha sido modificado, devuelve la nueva versión con un código 200 OK.