Minificador e Formatador de JavaScript

O que é esta ferramenta?

Um minificador de JavaScript reescreve o código para ser o mais pequeno possível, mantendo o mesmo comportamento: encurta nomes de variáveis e funções quando seguro, remove comentários e espaços em branco, simplifica constantes e elimina código inalcançável.

Esta ferramenta é construída sobre o Terser, o minificador baseado em AST utilizado pelo webpack, Vite, Rollup e pela maioria das ferramentas de build de JavaScript modernas. Como analisa efetivamente o seu código em vez de comparar padrões de texto, distingue corretamente um operador de divisão de um literal regex, não danifica template strings que contenham sequências semelhantes a //, e não renomeia uma variável para um nome que colida com algo num escopo exterior.

Por que usar?

• Minificação baseada em AST (Terser), o mesmo motor utilizado pelos principais bundlers — segura com literais regex, template strings e closures.
• Reduz nomes de variáveis para poupanças de tamanho reais, e não apenas remoção de espaços em branco.
• Veja exatamente quantos bytes e que porcentagem poupou.
• O modo Formatar transforma JS minificado numa única linha ofuscada de volta em código legível e indentado — útil para compreender scripts de terceiros.
• Processamento 100% local — código proprietário nunca sai do seu navegador.

Como usar

1. Cole o seu JavaScript na caixa de entrada, ou clique em «Carregar exemplo» para experimentar uma amostra com um literal regex e uma template string.
2. Clique em «Minificar» para o comprimir, ou em «Formatar» para o embelezar com indentação de 2 espaços.
3. Verifique a mensagem por baixo das caixas — o modo minificar mostra a redução de tamanho; um erro de sintaxe no seu código mostra uma mensagem clara, em vez de produzir silenciosamente um resultado corrompido.
4. Clique em «Copiar» para obter o resultado.

Exemplo

Entrada

function greet(name) {
  const pattern = /^[a-z]+$/i;
  const msg = `Hello, ${name}!`;
  if (pattern.test(name)) {
    // simple check
    return msg;
  }
  return "Hi there";
}

Resultado

function greet(n){const e=/^[a-z]+$/i,g=`Hello, ${n}!`;return e.test(n)?g:"Hi there"}

Os nomes das variáveis são encurtados, o comentário e a instrução if são reduzidos a uma expressão, mas o literal regex e a template string são preservados exatamente e o comportamento não é alterado.

Dicas práticas

• Minifique na altura do build, não editando à mão — mantenha o código-fonte legível sob controlo de versões e gere o bundle minificado como um passo de build.
• Se o resultado minificado se comportar de forma inesperada, verifique se há código que dependa de Function.prototype.name ou reflexão — a redução de nomes renomeia funções, o que pode surgir em casos raros.
• Formatar um script de terceiros antes de o ler é muito mais rápido do que tentar analisar uma única linha com 2000 caracteres.
• Combine com os minificadores de HTML e CSS abaixo se estiver preparando um bundle estático completo para deploy.

Onde isto se enquadra em fluxos de trabalho reais

O JavaScript é normalmente o maior recurso que bloqueia a renderização ou a análise numa página, pelo que minificá-lo tem um efeito real e mensurável no tempo de carregamento — mais do que HTML ou CSS, byte a byte. A maioria das frameworks modernas faz isto automaticamente na altura do build, mas scripts escritos à mão, extensões de navegador e bookmarklets são frequentemente publicados sem minificação, a menos que alguém os processe com uma ferramenta como esta.

A direção Formatar é frequentemente utilizada no sentido oposto: depurar um erro de produção a partir de um stack trace minificado torna-se muito mais fácil depois de o código circundante ser reformatado e legível, mesmo sem os nomes das variáveis originais.

→ Minificador de HTML · Minificador de CSS

Casos de utilização comuns

• Reduzir um script autónomo ou bookmarklet antes de o publicar.
• Reformatar um script minificado obtido de um site ao vivo para compreender o que faz.
• Limpar JavaScript colado a partir de uma publicação num fórum ou de um excerto gerado por IA antes de o ler com atenção.
• Verificar rapidamente se um excerto de JS escrito à mão tem um erro de sintaxe, já que uma falha de análise surge como uma mensagem explícita.

Perguntas frequentes