Compactação e Codificação de Transferência
Reduza o que atravessa a rede usando compactação gzip e Brotli, os tipos de conteúdo corretos e pré-compactação, para que as respostas cheguem mais rápido em qualquer conexão.
Compactação e Codificação de Transferência é uma aula grátis de Web Performance Optimization & Lighthouse no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Web Performance Optimization & Lighthouse, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Web Performance Optimization & Lighthouse inclui 4 aulas no total.
Partes desta aula ainda não foram traduzidas e aparecem em inglês.
Why Compress?
Text assets like HTML, CSS, JS, JSON, and SVG are highly compressible. Compressing them before transfer can cut payloads by 70-90%, directly speeding up load on every network.
How Negotiation Works
The browser advertises supported algorithms with the Accept-Encoding header; the server responds with the chosen one in Content-Encoding.
Accept-Encoding: br, gzip
Content-Encoding: brgzip
gzip is universally supported and a safe baseline. It offers good compression with low CPU cost and is enabled on virtually every server and CDN.
Brotli
Brotli (br) typically compresses text 15-25% smaller than gzip. It is supported in all modern browsers over HTTPS, making it the preferred choice today.
Compress the Right Types
Compress text-based MIME types only. Already-compressed binaries like JPEG, PNG, WebP, MP4, and woff2 fonts gain nothing and waste CPU if recompressed.
Static Precompression
For static assets, precompress at build time at the highest level. The server then serves the .br or .gz file directly, avoiding per-request CPU.
# nginx serving precompressed files
brotli_static on;
gzip_static on;Dynamic Compression Levels
For dynamic responses, use a lower compression level so CPU cost does not delay the response. High levels are best reserved for static, build-time compression.
Express Example
In Node, the compression middleware adds gzip/Brotli to dynamic responses with sensible defaults.
const compression = require('compression');
app.use(compression());Verifying Compression
Inspect a response in the Network panel: check Content-Encoding: br or gzip and compare transferred size to resource size. Lighthouse flags uncompressed text assets.
Compression and HTTPS
Modern compression for sensitive content is served over HTTPS, which also avoids historic attacks. Brotli in browsers is only offered on secure connections.
Strategy Summary
- Prefer Brotli, fall back to gzip.
- Compress text types only.
- Precompress static assets at max level.
- Use lower levels for dynamic responses.
Quick Check
You enable maximum-level compression on dynamically generated API responses and notice slower responses under load. What is the better approach?
Recap
You learned to shrink transfers with gzip and Brotli, negotiated via Accept-Encoding. Compress text types only, precompress static assets at max level, use lower levels for dynamic responses, and verify with the Network panel.
Aprenda Web Performance Optimization & Lighthouse com um tutor de IA — grátis
Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.
- Cursos
- 12
- Aulas
- 48
Perguntas Frequentes
A aula “Compactação e Codificação de Transferência” é grátis?
Sim — o texto completo de “Compactação e Codificação de Transferência” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Web Performance Optimization & Lighthouse, atualize para CoddyKit PRO. O curso de Web Performance Optimization & Lighthouse inclui 4 aulas no total.
O que vou aprender em “Compactação e Codificação de Transferência”?
Reduza o que atravessa a rede usando compactação gzip e Brotli, os tipos de conteúdo corretos e pré-compactação, para que as respostas cheguem mais rápido em qualquer conexão. Você pratica Web Performance Optimization & Lighthouse com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar Web Performance Optimization & Lighthouse?
Nenhuma experiência prévia é necessária. Web Performance Optimization & Lighthouse no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.
Quanto tempo leva a aula “Compactação e Codificação de Transferência”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de Web Performance Optimization & Lighthouse?
Sim. Cada aula de Web Performance Optimization & Lighthouse inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- Fundamentos de HTTP/2 e HTTP/3
- Armazenamento em cache no navegador e no servidor
- Redes de distribuição de conteúdo (CDNs)
- Compactação e Codificação de Transferência