# webpack vs Rollup: qual bundler para builds no CI?

> webpack vs Rollup no CI: bundling de app vs saída de biblioteca, tree-shaking, plugins e velocidade. Qual bundler se encaixa no seu pipeline de produção.

Source: https://latchkey.dev/pt/learn/tool-comparisons/webpack-vs-rollup  
Updated: 2026-06-26

O webpack é o bundler de apps peso-pesado com um vasto ecossistema de loaders/plugins; o Rollup é mais enxuto e preferido para saída de bibliotecas com tree-shaking.

O webpack é um bundler maduro e altamente configurável, feito para aplicações complexas, com loaders, code-splitting e um enorme ecossistema de plugins. O Rollup foca em saída limpa e com tree-shaking, sendo a escolha comum para publicar bibliotecas.

## Comparison

|  | webpack | Rollup |
| --- | --- | --- |
| Melhor para | Apps complexos | Bibliotecas, saída enxuta |
| Complexidade de configuração | Maior | Menor |
| Tree-shaking | Bom | Excelente |
| Ecossistema de plugins/loaders | O maior | Grande, maduro |
| Code-splitting | Maduro, flexível | Suportado |

## No CI

O webpack lida com builds de aplicações complexas - muitos entry points, code-splitting avançado e loaders para todo tipo de asset - ao custo de uma configuração mais pesada e builds mais lentos. O Rollup produz bundles menores e bem tree-shaken com configuração mais simples, e é por isso que é o preferido para bibliotecas (e o motor por trás dos builds de produção do Vite). Escolha pelo alvo de saída: app vs biblioteca.

## Deixe mais rápido

Faça cache do build e das dependências com chave no seu lockfile, e use cache persistente onde houver suporte. Ambos rodam em runners de CI; runners gerenciados mais rápidos reduzem o tempo total de builds pesados do webpack.

## Benchmark on your repository before choosing

Build-tool benchmarks published by vendors use repositories chosen to show a difference. Yours is the only one that matters, and both a cold and a warm measurement are needed because CI mostly runs cold.

```Terminal
# cold: no cache, the CI condition
rm -rf node_modules/.cache dist && time <tool> build

# warm: the local development condition
time <tool> build

# and the one people forget: incremental after a one-line change
echo "// touch" >> src/index.ts && time <tool> build
```

> Cold and warm can rank the two tools in opposite orders. Decide which one you are optimising for first: CI time is cold, developer feedback is warm and incremental.

## O veredito

Empacotando um app complexo com muitos tipos de asset e pontos de divisão: webpack. Publicando uma biblioteca ou querendo saída enxuta com tree-shaking: Rollup. Muitas equipes obtêm a saída do Rollup automaticamente via Vite.

## FAQ

### webpack vs Rollup: Which Bundler for CI Builds?

webpack is a mature, highly configurable bundler built for complex applications, with loaders, code-splitting, and a huge plugin ecosystem. Rollup focuses on clean, tree-shaken output and is the common choice for publishing libraries.

### In CI?

webpack handles complex application builds - many entry points, advanced code-splitting, and loaders for every asset type - at the cost of heavier config and slower builds. Rollup produces smaller, well tree-shaken bundles with simpler config, which is why it is the go-to for libraries (and the engine behind Vite's production builds).

### Speed it up?

Cache the build and dependencies keyed on your lockfile, and use persistent caching where supported. Both run on CI runners; faster managed runners cut the wall-clock time of heavy webpack builds.

### Which should I choose?

Bundling a complex app with many asset types and split points: webpack. Publishing a library or wanting lean, tree-shaken output: Rollup. Many teams get Rollup's output automatically via Vite.

---

Latchkey runs CI/CD that repairs its own failures. Agent entry points: https://latchkey.dev/agent.txt, https://latchkey.dev/openapi.json, https://latchkey.dev/llms.txt