Minificador de JavaScript
Encolha arquivos JavaScript e veja exatamente quanto você economizou.
Funciona no navegador. Nada do que você digita é enviado a lugar nenhum.
- Encurta nomes de variáveis
- Mostra bytes economizados
- Nada é enviado
Como minificar JavaScript
- Cole seu JavaScript.
- Desligue Comprimir ou Encurtar nomes de variáveis se precisar mantê-los legíveis.
- Copie ou baixe o arquivo minificado.
O que Comprimir e Encurtar nomes de variáveis fazem cada um
| Opção | O que faz |
|---|---|
| Comprimir | Remove código morto e simplifica expressões |
| Encurtar nomes de variáveis | Renomeia variáveis locais para nomes curtos como a, b e c |
O que continua igual de qualquer jeito
- Comportamento público: as mesmas entradas ainda produzem as mesmas saídas.
- Toda string no código, incluindo qualquer texto mostrado aos usuários.
- A ordem em que as operações rodam.
- Um comentário /*! ... */, já que o Terser mantém esse estilo por padrão, a convenção que muitas bibliotecas usam para avisos de licença.
Dicas para minificar JavaScript
- Guarde uma cópia não minificada, ou gere um source map na sua ferramenta de build, para os erros de produção continuarem legíveis.
- Desligue Encurtar nomes de variáveis para uma biblioteca que outros desenvolvedores vão ler, para as mensagens de erro manterem nomes com sentido.
- Rode testes contra a saída minificada antes de publicar, já que um caso raro em um minificador ainda é possível mesmo este sendo muito usado.
Perguntas frequentes sobre Minificador de JavaScript
JavaScript minificado ainda é código válido?
Sim. Ele roda exatamente igual ao original, só com nomes mais curtos e sem espaço em branco extra.
Quanto o JavaScript costuma encolher?
Muitas vezes de 30 a 60 por cento, dependendo de quantos comentários e nomes de variável longos o original tem.
O que acontece se meu código tiver um erro de sintaxe?
O erro é mostrado com a linha e a coluna onde aconteceu, para você corrigir e tentar de novo.
Qual é a diferença entre Comprimir e Encurtar nomes de variáveis?
Comprimir reescreve o código para remover ramos mortos e simplificar expressões. Encurtar nomes de variáveis renomeia variáveis locais para letras únicas. Você pode desligar cada um separadamente.
Consegue minificar sintaxe moderna como async e arrow functions?
Sim, incluindo sintaxe do ES2020 em diante, como optional chaining e async ou await.
Qual minificador isso usa?
Terser, o sucessor padrão do UglifyJS e o minificador que a maioria dos bundlers, incluindo webpack, Rollup e esbuild, usa por padrão.
Minificar pode quebrar meu código?
Não deveria mudar o comportamento de um código normal. Código que lê o nome original de uma função ou variável em tempo de execução, por exemplo através de truques de introspecção fora do padrão, pode quebrar quando os nomes são encurtados. Desligue Encurtar nomes de variáveis se isso se aplicar a você.
Suporta sintaxe do TypeScript?
Não, isso espera JavaScript puro. As anotações de tipo do TypeScript não são JavaScript válido e vão causar um erro de sintaxe aqui, então compile o TypeScript para JavaScript primeiro.