JavaScript Minifier — Minificador de JavaScript

Como funciona a minificação de JavaScript

A minificação deixa o JavaScript menor sem alterar o que ele faz. Esta ferramenta usa o Terser, um minificador maduro que analisa o seu código e o converte numa árvore de sintaxe abstrata, transforma essa árvore e volta a imprimir o código sem espaços e comentários desnecessários. A etapa compress aplica dezenas de otimizações: remove código inalcançável e variáveis não utilizadas, substitui constantes diretamente no código, junta declarações de variáveis consecutivas, transforma instruções if em expressões condicionais mais curtas sempre que possível e calcula antecipadamente expressões constantes simples. Em seguida, a etapa mangle renomeia variáveis locais, parâmetros e nomes de funções para uma ou duas letras. Os nomes de propriedades e as variáveis globais não são alterados, por isso o comportamento público do seu código continua o mesmo.

Os indicadores de tamanho mostram o tamanho em bytes UTF-8 da entrada e da saída e a percentagem poupada. Código típico escrito à mão fica 40–70% menor; código que já é compacto ou dominado por strings longas diminui menos. Lembre-se de que os servidores normalmente voltam a comprimir o JavaScript com gzip ou Brotli, por isso a poupança real na transferência é menor do que o valor bruto, mas o código minificado continua a ser analisado mais depressa e a gastar menos largura de banda.

Como escolher as opções certas

A opção ECMAScript target indica ao Terser que sintaxe pode usar na saída. Com ES2020 pode gerar arrow functions, optional chaining e outras formas modernas; com ES5 evita introduzir sintaxe mais recente, embora não transpile o código moderno que você escreveu — para isso, use uma ferramenta como Babel ou esbuild. Keep console.* mantém os registos de log, o que é útil em builds de staging. Ative ES module para ficheiros que usam import/export; isso também permite encurtar nomes de nível superior, porque o escopo do módulo é privado.

Privado por conceção

O minificador é carregado apenas quando necessário e é executado localmente, por isso o seu código-fonte nunca é enviado para lado nenhum. Isso torna-o adequado para tarefas rápidas e pontuais, como reduzir um script inline, um bookmarklet ou um snippet para um gestor de tags de terceiros. Se o Terser encontrar um erro de sintaxe, a mensagem indica a linha e a coluna para que possa corrigir a entrada. Para bundles de produção, mantenha a minificação no seu pipeline de build para que seja reproduzível e gere source maps para depuração.