Lista de verificación de compresión de activos estáticos de S3
Siga esta lista de verificación paso a paso para configurar su depósito AWS S3 y su distribución de CloudFront para servir correctamente los activos estáticos GZIP y Brotli precomprimidos. La lista de verificación de compresión de activos estáticos de S3 cubre la política de depósito, la carga de archivos precomprimidos con metadatos de codificación de contenido correctos, la política de caché de CloudFront, los encabezados Vary y los comandos de verificación, cada uno con fragmentos de AWS CLI y Terraform listos para copiar. Todo el contenido se ejecuta en su navegador, no es necesario registrarse.
Enable public read access (or use CloudFront OAC)
For public static sites, configure the bucket policy to allow s3:GetObject. For private assets served via CloudFront, use Origin Access Control (OAC) instead of public access.
Enable static website hosting (if serving directly from S3)
Go to S3 → Bucket → Properties → Static website hosting → Enable. Set index.html as the index document. Skip this step if you are serving exclusively through CloudFront.
Configure CORS for font and API assets (if needed)
If your S3 bucket serves fonts or JSON assets loaded cross-origin, add a CORS configuration to allow the correct origins.
Upload pre-compressed .gz files alongside originals
Pre-compress your static assets at build time and upload both the original and .gz version. S3 does not compress on-the-fly - you must upload pre-compressed files.
Upload pre-compressed .br files for Brotli support
Upload Brotli-compressed versions of your assets. CloudFront can serve .br files to clients that send Accept-Encoding: br.
Set correct Content-Type on all uploaded files
S3 must serve the correct Content-Type for each asset - not the MIME type of the compressed wrapper. Set Content-Type to the original file type (e.g. application/javascript for .js.gz).
Set Cache-Control headers on uploaded assets
Set long-lived Cache-Control headers on versioned/hashed assets and short-lived headers on index.html and other non-versioned files.
Create a CloudFront distribution with S3 as origin
Create a CloudFront distribution pointing to your S3 bucket. Use the S3 REST endpoint (not the website endpoint) for OAC support and better performance.
Enable CloudFront automatic compression
In CloudFront → Behaviors → Edit → Compress objects automatically → Yes. This enables CloudFront to compress responses on-the-fly for objects not already compressed. For pre-compressed assets, CloudFront will pass through the Content-Encoding header.
Configure cache policy to forward Accept-Encoding
Create a CloudFront cache policy that includes Accept-Encoding in the cache key. This ensures CloudFront caches separate versions for GZIP, Brotli, and uncompressed responses.
Enforce HTTPS with redirect-to-https viewer protocol policy
Set the viewer protocol policy to "Redirect HTTP to HTTPS" to ensure all traffic is encrypted. This is required for Brotli - browsers only send Accept-Encoding: br over HTTPS.
Add Vary: Accept-Encoding response header
Configure a CloudFront response headers policy to add Vary: Accept-Encoding. This tells downstream caches (browsers, CDN edge nodes) to cache separate versions for different encodings.
Add security headers via CloudFront response headers policy
Use a CloudFront managed response headers policy (SecurityHeadersPolicy) or create a custom one with X-Content-Type-Options, X-Frame-Options, and Strict-Transport-Security.
Verify GZIP compression is working
Use curl to confirm CloudFront is serving GZIP-compressed responses with the correct Content-Encoding header.
Verify Brotli compression is working
Confirm CloudFront serves Brotli-compressed responses when the client sends Accept-Encoding: br.
Verify CloudFront cache hit ratio
Check the X-Cache response header to confirm CloudFront is caching compressed responses. "Hit from cloudfront" means the response was served from cache.
Measure actual transfer size savings
Use curl with --compressed to measure the actual transfer size vs the uncompressed size and confirm the expected savings.
Quick Reference: S3 + CloudFront Compression Architecture
Browser │ Accept-Encoding: gzip, br ▼ CloudFront Edge │ Checks cache key (includes Accept-Encoding) │ Cache HIT → serve cached compressed response │ Cache MISS → forward to S3 origin ▼ S3 Origin │ Returns pre-compressed file (app.js with Content-Encoding: gzip) │ OR returns uncompressed file (CloudFront compresses on-the-fly) ▼ CloudFront Edge │ Caches response keyed by Accept-Encoding │ Adds Vary: Accept-Encoding header ▼ Browser │ Decompresses response transparently └ Renders page
¿Por qué utilizar nuestra lista de verificación de compresión de activos estáticos de S3?
- Complete la configuración de compresión de S3 en un solo lugar: la lista de verificación de compresión de activos estáticos de S3 cubre cada paso (política de depósito, carga de archivos precomprimidos, configuración de CloudFront, encabezados Vary y comandos de verificación) para que no se pierda ningún paso crítico que rompa la compresión.
- Lista de verificación de compresión segura S3 en línea: todo el contenido de la lista de verificación se genera íntegramente en su navegador. No se envían credenciales de AWS, nombres de depósitos ni nombres de dominio a ningún servidor: es seguro para planificar configuraciones de compresión de producción S3 y CloudFront.
- Fragmentos de configuración para cada paso: cada elemento de la lista de verificación incluye un fragmento de configuración listo para copiar (comandos de AWS CLI, recursos de Terraform, políticas de depósito y comandos de verificación de curl) para que pueda implementar cada paso de inmediato.
- 100% gratis para siempre: la lista de verificación de compresión de activos estáticos de S3 es completamente gratuita, sin registro, sin nivel premium, sin límites y sin anuncios. Úsalo tantas veces como necesites, para siempre.
Por qué la compresión S3 requiere precompresión
A diferencia de Nginx o Apache, Amazon S3 no comprime las respuestas sobre la marcha. S3 es un servicio de almacenamiento de objetos: entrega archivos exactamente tal como fueron cargados. Para ofrecer recursos comprimidos desde S3, debe comprimir previamente sus archivos en el momento de la compilación y cargar tanto la versión original como la comprimida con los metadatos de codificación de contenido correctos. Nuestra lista de verificación de compresión de activos estáticos de S3 lo guía en cada paso de este proceso, desde la configuración del depósito hasta la configuración y verificación de la política de caché de CloudFront.
Cómo funciona la lista de verificación de compresión S3
- Trabaje en cada categoría: la lista de verificación está organizada en cinco categorías: configuración del depósito S3, carga de archivos precomprimidos, configuración de CloudFront, encabezados de respuesta y verificación. Haga clic en cada elemento para expandir fragmentos de configuración y advertencias.
- Marque los pasos completados: haga clic en el ícono circular al lado de cada elemento para marcarlo como completo. La barra de progreso realiza un seguimiento de su finalización general en todos los elementos de la lista de verificación.
- Copiar e implementar: cada elemento incluye un comando de AWS CLI, un recurso de Terraform o un comando de verificación de curl listo para copiar; haga clic en Copiar para usarlo inmediatamente en su terminal o canalización.
Qué cubre la lista de verificación
- Configuración del depósito S3: política del depósito para lectura pública o CloudFront OAC, alojamiento de sitios web estáticos y configuración CORS para fuentes de origen cruzado y activos API.
- Carga de archivos precomprimidos: cómo cargar archivos.gz y.br con metadatos de codificación de contenido, tipo de contenido y control de caché correctos mediante la CLI de AWS.
- Configuración de CloudFront: configuración de distribución, compresión automática, política de caché con codificación de aceptación en la clave de caché y aplicación de HTTPS.
- Verificación: comandos curl para confirmar que GZIP y Brotli están funcionando, verificaciones de la tasa de aciertos de caché y medición del tamaño de transferencia.
S3 + CloudFront frente a compresión sobre la marcha
La precompresión + S3 es más eficiente que la compresión sobre la marcha para activos estáticos: el costo de la CPU de compresión se paga una vez en el momento de la compilación, no en cada solicitud. CloudFront también puede comprimir respuestas sobre la marcha para objetos que aún no están comprimidos (objetos ≥1000 bytes), pero la precompresión le brinda niveles de compresión máximos (GZIP nivel 9, calidad Brotli 11) que la compresión sobre la marcha de CloudFront no utiliza. Para obtener el mejor rendimiento, comprima previamente sus recursos y cárguelos en S3 con los metadatos correctos: CloudFront pasará por el encabezado Content-Encoding de forma transparente.
Preguntas frecuentes
La lista de verificación de compresión de activos estáticos de S3 es una guía paso a paso para configurar AWS S3 y CloudFront para servir correctamente los activos estáticos GZIP y Brotli precomprimidos. Cubre la política de depósito, la carga de archivos precomprimidos con metadatos correctos, la política de caché de CloudFront, los encabezados Vary y los comandos de verificación.
No. Amazon S3 es un servicio de almacenamiento de objetos: entrega archivos exactamente tal como fueron cargados. Para ofrecer activos comprimidos desde S3, debe comprimir previamente sus archivos en el momento de la compilación y cargarlos con los metadatos de codificación de contenido correctos. CloudFront puede comprimir respuestas sobre la marcha para objetos no comprimidos, pero la precompresión proporciona mejores relaciones de compresión.
Sí. La lista de verificación de compresión de activos estáticos de S3 es 100% gratuita, sin registro, suscripción, límites ni anuncios. Todo el contenido de la lista de verificación se genera en su navegador; no se envían credenciales de AWS ni datos de configuración a ningún servidor.
Cargue el archivo comprimido usando el nombre de archivo original (por ejemplo, app.js, no app.js.gz) y configure Content-Encoding: gzip y Content-Type: application/javascript. Esto indica a los navegadores que descompriman la respuesta de forma transparente. Si lo carga como app.js.gz sin codificación de contenido, los navegadores lo descargarán como un archivo binario.
Habilite "Comprimir objetos automáticamente" en la configuración de comportamiento de CloudFront y cree una política de caché con EnableAcceptEncodingBrotli: verdadero. CloudFront ofrecerá Brotli a los clientes que envíen Accept-Encoding: br. Nota: Brotli solo se negocia a través de HTTPS.
Sin Accept-Encoding en la clave de caché, CloudFront almacena en caché solo una versión de cada objeto. Si una respuesta comprimida se almacena en caché y se entrega a un cliente que no admite GZIP, el navegador recibe contenido dañado. Incluir Accept-Encoding en la clave de caché garantiza que CloudFront almacene en caché versiones separadas para cada codificación.
La compresión sobre la marcha de CloudFront utiliza GZIP nivel 6 y solo comprime objetos ≥1000 bytes. La precompresión utiliza niveles máximos (GZIP nivel 9, calidad Brotli 11) y carga archivos comprimidos a S3. La precompresión es más eficiente para activos estáticos ya que el costo de la CPU se paga una vez en el momento de la compilación.
Ejecute: `curl -H "Accept-Encoding: gzip" -I https://YOUR-CLOUDFRONT-DOMAIN/app.js` y busque `Content-Encoding: gzip`. Para Brotli: `curl -H "Accept-Encoding: br" -I https://YOUR-CLOUDFRONT-DOMAIN/app.js` y busque `Content-Encoding: br`.
Utilice el punto final REST de S3 con CloudFront Origin Access Control (OAC). El punto final del sitio web de S3 no admite OAC, requiere acceso al depósito público y no admite HTTPS de CloudFront a S3. El punto final REST con OAC es más seguro y admite todas las funciones de CloudFront.