nextjs-turbopack

Next.js e Turbopack

O Next.js 16+ utiliza o Turbopack por padrão para desenvolvimento local: um empacotador incremental escrito em Rust que acelera significativamente a inicialização do dev e as atualizações a quente (HMR).

Quando Usar

• Turbopack (dev padrão): Use para o desenvolvimento do dia a dia. Inicialização a frio mais rápida e HMR, especialmente em aplicações grandes.
• Webpack (dev legado): Use apenas se encontrar um bug no Turbopack ou depender de um plugin exclusivo do webpack em desenvolvimento. Desabilite com --webpack (ou --no-turbopack, dependendo da versão do Next.js; consulte a documentação da sua versão).
• Produção: O comportamento da build de produção (next build) pode usar Turbopack ou webpack dependendo da versão do Next.js; consulte a documentação oficial do Next.js para sua versão.

Use quando: estiver desenvolvendo ou depurando aplicações Next.js 16+, diagnosticando inicialização lenta de dev ou HMR, ou otimizando pacotes de produção.

Como Funciona

• Turbopack: Empacotador incremental para o dev do Next.js. Utiliza cache em sistema de arquivos, tornando as reinicializações muito mais rápidas (por exemplo, 5 a 14 vezes em projetos grandes).
• Padrão em dev: A partir do Next.js 16, next dev é executado com Turbopack, a menos que seja desabilitado.
• Cache em sistema de arquivos: Reinicializações reaproveitam o trabalho anterior; o cache geralmente fica em .next; nenhuma configuração extra é necessária para uso básico.
• Bundle Analyzer (Next.js 16.1+): Bundle Analyzer experimental para inspecionar a saída e encontrar dependências pesadas; habilite via configuração ou flag experimental (consulte a documentação do Next.js para sua versão).

Exemplos

Comandos

next dev
next build
next start

Uso

Execute next dev para desenvolvimento local com Turbopack. Use o Bundle Analyzer (consulte a documentação do Next.js) para otimizar code-splitting e reduzir dependências grandes. Prefira App Router e server components quando possível.

Nomenclatura do Arquivo de Middleware

O Next.js 16 introduziu proxy.ts como o nome do arquivo de middleware, substituindo a convenção anterior middleware.ts:

• Next.js 16+: use proxy.ts na raiz do projeto
• Pré-Next.js 16: use middleware.ts na raiz do projeto

A mudança de nome está vinculada à versão do Next.js, não ao empacotador (Turbopack ou webpack) em uso. Consulte sempre a documentação oficial da versão que você está analisando.

Não sinalize proxy.ts como um arquivo de middleware mal nomeado ou ausente em projetos Next.js 16. O arquivo está correto e intencional. Sugerir uma renomeação para middleware.ts quebrará a execução do middleware.

Referência: Documentação do proxy no Next.js

Melhores Práticas

• Mantenha-se em uma versão recente do Next.js 16.x para garantir comportamento estável do Turbopack e do cache.
• Se o dev estiver lento, verifique se você está usando Turbopack (padrão) e que o cache não está sendo limpo desnecessariamente.
• Para problemas de tamanho de pacote em produção, use as ferramentas oficiais de análise de pacotes do Next.js para sua versão.