O Que É um Chunk? Uma Unidade Divisível da Saída do Bundle
Um chunk é um único arquivo de saída que um bundler emite, criado quando o code splitting divide sua aplicação em partes carregáveis separadamente.
Quando um bundler divide seu código, os arquivos resultantes são chamados de chunks. Cada chunk é uma unidade que o navegador pode buscar por conta própria. Os chunks são a razão pela qual uma aplicação pode carregar um bundle inicial pequeno e trazer o restante conforme necessário. A forma como os chunks são nomeados e agrupados tem efeito direto sobre o cache, o que é uma preocupação de deploy e de CI.
Como os chunks são criados
Os chunks vêm de imports dinâmicos, múltiplos entry points e do bundler extraindo dependências compartilhadas. Um chunk inicial carrega com a página; chunks assíncronos carregam sob demanda quando seu código é necessário.
Chunks de vendor e compartilhados
Os bundlers muitas vezes separam bibliotecas de terceiros em um chunk de vendor e o código de aplicação compartilhado em chunks comuns. Como esses mudam com menos frequência do que o código de features, eles permanecem em cache entre deploys, economizando downloads repetidos.
Nomeação e hashing
- Chunks de produção incluem um content hash no nome do arquivo.
- O hash muda apenas quando o conteúdo do chunk muda.
- Chunks inalterados mantêm seu nome e permanecem em cache após um deploy.
Chunks demais ou de menos
Chunks muito grandes atrasam o carregamento e não fazem bom cache; chunks muito pequenos adicionam overhead de requisições. Ajustar a estratégia de chunks é um equilíbrio entre eficiência de cache e número de requisições.
Chunks no CI/CD
O build emite todos os chunks na pasta de saída, cada um com content hash, e o pipeline os envia para uma CDN. Como os hashes mudam apenas para chunks modificados, um deploy invalida o mínimo de cache, e chunks de vendor estáveis permitem que usuários recorrentes pulem a maioria dos downloads.
Principais conclusões
- Um chunk é um arquivo de saída que o bundler emite, muitas vezes a partir do code splitting.
- Chunks de vendor e compartilhados permanecem em cache entre deploys, economizando downloads.
- Nomes de chunk com content hash fazem com que um deploy invalide apenas o que mudou.