¿Qué es la elusión de caché?
La elusión de caché publica el contenido modificado con una URL nueva, normalmente al incluir un hash del contenido o un identificador de versión en el nombre del archivo, la ruta o la cadena de consulta. Las cachés HTTP buscan las respuestas almacenadas por URL, por lo que una solicitud a la dirección nueva no puede responderse con la copia almacenada bajo la anterior, siempre que ninguna caché esté configurada para ignorar la parte de la URL que cambió.
Cómo funciona la elusión de caché
Una caché HTTP reutiliza una respuesta almacenada mientras está vigente sin contactar con el servidor de origen, por lo que un archivo servido con un max-age de larga duración deja de generar las solicitudes mediante las cuales el servidor podría reemplazarlo. Normalmente es posible purgar una CDN, pero la purga no alcanza las copias que los navegadores ya conservan. La elusión de caché evita ambos problemas. Según la especificación, una clave de caché contiene al menos el método de la solicitud y la URL; algunas CDN pueden configurarse para excluir la cadena de consulta. Una URL cuya clave no se ha almacenado no tiene ninguna respuesta almacenada, por lo que cada caché debe reenviar la solicitud hacia el servidor de origen. En la práctica, los archivos con versiones reciben un max-age de larga duración (el ejemplo de MDN usa un año, max-age=31536000), opcionalmente con immutable, mientras que el documento que hace referencia a ellos se sirve con no-cache, de modo que una caché debe revalidarlo antes de reutilizarlo y una nueva carga de la página recibe los nombres de archivo actuales. MDN señala que no-cache no garantiza la revalidación al navegar por el historial, por lo que el botón Atrás puede restaurar una página anterior. Los empaquetadores como webpack y Vite generan los nombres de archivo con hash durante la compilación.
Datos clave
- ¿Nombre de archivo o cadena de consulta? Tanto
app.3f9a1c.jscomoapp.js?v=3f9a1ccambian la URL, pero una versión en la cadena de consulta solo funciona si todas las cachés de la ruta conservan esa cadena en su clave de caché. El nivel de caché Standard predeterminado de Cloudflare lo hace, mientras que su nivel Ignore Query String sirve una única copia en caché de un archivo estático, sea cual sea el valor de la consulta. Amazon CloudFront solo almacena en caché según la cadena de consulta cuando la distribución está configurada para hacerlo, y los buckets de backend de Google Cloud CDN necesitan que el parámetro de versión figure en una lista de inclusión. Una versión en la cadena de consulta también suele dejar un único archivo en el servidor de origen que cada versión publicada sobrescribe en la misma ubicación, por lo que una página de la versión anterior que solicita su antigua URL?v=tras un fallo de caché recibe el archivo de la versión nueva. Las recomendaciones de Google para Cloud CDN aconsejan usar nombres de archivo únicos, porque un archivo actualizado en la misma ubicación puede almacenarse en caché mientras está incompleto. - ¿Los archivos sin cambios conservarán su URL entre versiones? Con un hash del contenido, sí, siempre que la compilación genere bytes idénticos; un número de versión o una marca de tiempo aplicados a todas las rutas cambian todas las URL en cada versión publicada y descartan las copias en caché de archivos que no cambiaron. Aun así, el hash de un archivo puede cambiar aunque su código fuente no lo haya hecho: la guía de almacenamiento en caché de webpack muestra cómo cambia el
[contenthash]de un paquete de dependencias tras añadir un módulo no relacionado, porque los IDs de los módulos seguían el orden de resolución. La guía señala que el modo de producción de webpack 5 usa de forma predeterminada IDs de módulo deterministas y también traslada el entorno de ejecución a su propio fragmento. - ¿Qué orden debe seguir un despliegue? Sube primero los archivos nuevos con versiones y publica al final el documento que hace referencia a ellos; las recomendaciones de Google para Cloud CDN consideran crucial la subida de las dependencias antes que los archivos que hacen referencia a ellas. Mantén disponibles también los archivos de la versión anterior: una página cargada antes del despliegue sigue solicitando los nombres antiguos, y tanto webpack como Vite documentan fallos de carga de fragmentos o errores de importación cuando un despliegue los elimina. La guía de webpack sugiere dejar que la CDN haga caducar los archivos antiguos después de aproximadamente un día, en lugar de hacerlo en el siguiente despliegue, y recargar la página como máximo una vez cuando un fragmento siga sin cargarse, ya que una pestaña puede permanecer abierta más tiempo que el período de retención.
- ¿Qué aporta
immutablea unmax-agede larga duración? Indica a los clientes que no revaliden el archivo al recargar mientras siga vigente, lo que evita solicitudes condicionales que solo devolverían 304. No prolonga la vigencia y solo es correcto cuando el archivo en esa URL no cambiará mientras la respuesta esté vigente, como ocurre con un nombre de archivo con hash que nunca se sobrescribe. MDN señala que Chrome no implementa la directiva y, en su lugar, omite la revalidación de los subrecursos al recargar.
Cuándo importa la elusión de caché
Usa la elusión de caché para subrecursos como scripts, hojas de estilo e imágenes que los navegadores y las CDN deberían conservar durante mucho tiempo, pero cuyas nuevas versiones deberían obtener justo después de una publicación. No puede aplicarse a una URL que deba permanecer igual, como la del documento HTML que hace referencia a esos archivos; sirve ese documento con no-cache para que los navegadores lo revaliden en cada nueva carga de la página. Si la CDN está configurada para servir el documento desde su propia caché sin revalidarlo, purga también esa copia en cada despliegue; una purga por sí sola no actualiza las copias de los navegadores. Cada clave de caché nueva empieza sin datos almacenados: cada caché debe obtener el archivo una vez, desde el servidor de origen o desde una caché más cercana a él, antes de poder servirlo.
Cómo ayuda Transloadit con la elusión de caché
Smart CDN de Transloadit asigna una URL propia a cada variante transformada: el Workspace, el nombre del Template, la ruta del archivo de origen y los parámetros de transformación forman parte de la dirección tlcdn.com. Por tanto, solicitar un tamaño o formato diferente cambia la URL y produce una variante independiente almacenada en caché, mientras que un acierto de caché para la misma URL reutiliza el resultado almacenado en lugar de ejecutar de nuevo el Template. En las URL firmadas, la vigencia efectiva de una respuesta en caché está limitada por el tiempo de vigencia restante de la firma.
Las páginas enlazadas aquí no describen una operación de purga ni qué ocurre con un resultado en caché cuando se reemplaza el original sin cambiar la ruta del archivo. Al almacenar un original de reemplazo en una ruta nueva, cambia la URL de Smart CDN; prueba el caso en que la ruta no cambia en tu propio Workspace antes de depender de ese comportamiento.
Fuentes
- MDN: almacenamiento en caché HTTP, incluida la elusión de caché y los recursos principales
- RFC 9111: almacenamiento en caché HTTP (claves de caché y vigencia)
- RFC 8246: respuestas HTTP inmutables
- Buenas prácticas de Google Cloud CDN: URL con versiones y orden de subida
- Cloudflare: niveles de caché y cadenas de consulta
- Amazon CloudFront: almacena contenido en caché según los parámetros de la cadena de consulta
- Guía de webpack: almacenamiento en caché, hashes del contenido y despliegue de una nueva compilación
- Vite: compilación para producción (gestión de errores de carga)