Herramientas GitHub Pages

Gratis Generador de cabecera Cache-Control

Crea cabeceras HTTP Cache-Control correctas para assets estáticos, páginas HTML y contenido sensible.

Cargando herramienta...

Qué es Generador de cabecera Cache-Control?

El encabezado HTTP Cache-Control indica a los navegadores y CDN durante cuánto tiempo deben conservar un recurso antes de obtener una copia nueva. Configurarlo correctamente mejora la velocidad de la página para visitantes recurrentes y reduce solicitudes innecesarias. La falta de encabezados de caché o el uso de valores demasiado agresivos es una razón común por la que los usuarios ven contenido obsoleto después de una implementación.

Respuesta rápida

Use el encabezado HTTP Cache-Control para indicar a los navegadores y CDN cuánto tiempo conservar un recurso antes de revalidarlo. Para sitios estáticos: use public, max-age=31536000, immutable en CSS/JS con huella digital, public, max-age=0, must-revalidate en HTML y no-store en páginas sensibles.

Last updated: 2026-05-28

Limitaciones

  • GitHub Pages no admite encabezados Cache-Control personalizados — solo ETag y Last-Modified se proporcionan automáticamente. Use Cloudflare u otro CDN delante para reglas de caché personalizadas.
  • La directiva immutable no es un estándar RFC oficial pero es ampliamente compatible con navegadores modernos y CDN. Los proxies HTTP/1.1 muy antiguos pueden ignorarla.
  • Los navegadores pueden almacenar contenido en caché incluso cuando están desconectados o en la caché de retroceso-avance aunque Cache-Control indique no-store. Cache-Control es una sugerencia, no una garantía.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

Cómo usar esta herramienta

  1. Seleccione el tipo de recurso que coincide con su contenido: HTML estático, CSS/JS con huella digital, imágenes, feeds, páginas privadas o no-store.
  2. Elija su plataforma de alojamiento para obtener consejos de implementación específicos si es necesario.
  3. Copie el valor del encabezado Cache-Control y agréguelo a la configuración de su servidor, reglas CDN o archivo de encabezados de su plataforma de alojamiento.

Para qué puedes usarla

  • Configurar caché agresivo para archivos CSS y JS con huella digital y nombres de archivo con hash de contenido.
  • Prevenir el almacenamiento en caché de páginas de autenticación, flujos de pago y datos sensibles de usuario.
  • Configurar la frescura de feeds y sitemaps para que los rastreadores obtengan contenido actualizado sin solicitudes excesivas.

Casos de uso

Ejemplos prácticos

Ejemplo

Activos con huella digital en Netlify

Un sitio estático usa nombres de archivo hasheados como main.a3f8b2.js. Configure el encabezado Cache-Control a public, max-age=31536000, immutable en el archivo _headers de Netlify para que los visitantes recurrentes carguen instantáneamente desde la caché.

Ejemplo

Página de pago sensible

Un sitio de comercio electrónico sirve una página de pago que nunca debe almacenarse en caché por CDN o navegadores. Configure Cache-Control: no-store para asegurar que cada solicitud obtenga una copia nueva desde el origen.

Errores comunes

  • Establecer un max-age largo en páginas HTML que cambian con frecuencia — los usuarios ven contenido obsoleto después de una implementación.
  • Usar no-store en cada página en lugar de no-cache o max-age=0 dirigidos, lo que perjudica el rendimiento.
  • Olvidar que GitHub Pages ignora los encabezados Cache-Control personalizados — solo ETag y Last-Modified se configuran automáticamente.

Verificación

  1. Revise el encabezado Cache-Control en la pestaña Network de las herramientas de desarrollo del navegador — busque el encabezado de respuesta en el recurso específico.
  2. Use curl -I https://susitio.com/ruta para verificar los encabezados desde la línea de comandos. Confirme que el CDN está transmitiendo correctamente el encabezado de origen.

FAQ

Preguntas sobre Generador de cabecera Cache-Control

Cuál es la diferencia entre no-cache y no-store?

no-cache significa que el navegador debe revalidar con el servidor antes de usar una copia en caché — la respuesta aún puede almacenarse en caché, pero debe confirmarse como fresca. no-store significa que nada puede almacenarse en caché, ni siquiera en memoria. Use no-cache con must-revalidate para la mayoría de las páginas críticas de actualización; use no-store solo para datos sensibles como páginas de pago.

Cómo configuro Cache-Control en GitHub Pages?

GitHub Pages establece Cache-Control: max-age=600 (10 minutos) para HTML y max-age=31536000 (1 año) para activos versionados automáticamente. No puede anular estos valores. Si necesita encabezados de caché personalizados, use Cloudflare delante de GitHub Pages con Page Rules, o cambie a Netlify o Vercel que admiten archivos _headers personalizados.

Qué significa immutable en Cache-Control?

La extensión immutable indica al navegador que omita la revalidación incluso cuando el usuario presiona el botón de actualizar. Úsela solo en recursos versionados con nombres de archivo con hash de contenido (como app.a3f8b2.js). Si el contenido cambia, el nombre del archivo cambia, por lo que la versión en caché nunca está obsoleta por definición. Nunca use immutable en URL no versionadas.

Durante cuánto tiempo debería almacenar en caché las imágenes en un sitio estático?

Para imágenes sin nombres de archivo versionados, un max-age de 86400 (24 horas) es un valor predeterminado seguro — las imágenes rara vez cambian pero desea que las actualizaciones se propaguen en un día. Para imágenes con huella digital (logo.v2.png), use max-age=31536000 con immutable. Para imágenes que cambian diariamente (como un gráfico diario), use max-age=3600 o max-age=0 con must-revalidate.

Herramientas relacionadas

Más herramientas github pages

Prueba también

Prueba también