Softonic

Minificador de JavaScript

Etapa 1 / 3

Cole um script ou um módulo ES de até 1.000.000 caracteres, ou abra um arquivo .js.

Próximo: escolher as opções

Cole o JavaScript e obtenha uma versão minificada que é 40-70% menor, espaços em branco removidos, variáveis encurtadas para letras únicas, ramos mortos removidos, constantes dobradas e (se você ativar) comentários eliminados. Útil para verificações rápidas de tamanho, embeds únicos e páginas de destino onde você não está executando uma cadeia de ferramentas completa.

Como minificar JavaScript

  1. 1

    Cole a fonte

    Qualquer JavaScript ES5+ válido. Para ES6 e além (literais de template, classes, módulos), certifique-se de que seu alvo corresponda.

  2. 2

    Escolha a agressividade

    Seguro (espaços em branco + comentários), padrão (+ renomeação de variáveis), agressivo (+ ofuscar propriedades, pode quebrar acesso ao DOM).

  3. 3

    Minificar

    A ferramenta executa uma transformação compatível com Terser e gera o resultado com contagens de bytes antes/depois.

  4. 4

    Copiar ou baixar

    Cole a saída em uma tag `<script>` ou salve como um `.min.js` para servir do seu CDN.

Para onde vão os bytes

Um arquivo minificado típico é 40-70% menor que a fonte. Envolvê-lo em gzip (ou Brotli, que Cloudflare e a maioria dos CDNs usam) reduz mais 60-75%. Combinado, uma fonte de 100 KB pode ser enviada como ~15-25 KB pela rede.

Fonte Minificado +gzip +Brotli
jQuery 3.6 87 KB 30 KB 27 KB
Lodash 4.17 71 KB 25 KB 22 KB
React + ReactDOM 18 140 KB 44 KB 39 KB

Técnicas aplicadas

Técnica O que faz
Remoção de espaços em branco Remove espaços, tabs, quebras de linha
Remoção de comentários Remove // e /* */ (comentários de licença como /*! podem ser mantidos)
Ofuscação de variáveis Renomeia userName -> u (seguro para escopo)
Ofuscação de propriedades Renomeia obj.foo -> obj.a (NÃO SEGURO)
Dobragem de constantes 1 + 2 + 3 -> 6
Eliminação de código morto Remove ramos após return
Inline de controle de fluxo Inline funções pequenas usadas uma vez
Sequências e booleanos a(); b(); -> a(),b();, true -> !0

Modo seguro vs agressivo

  • Seguro mantém nomes de variáveis, apenas remove espaços em branco e comentários. Bom para depuração onde você deseja rastros de pilha legíveis.
  • Padrão ofusca locais, mas mantém globais e nomes de propriedades. Funciona com a maioria do código.
  • Agressivo ofusca tudo, incluindo nomes de propriedades. Frequentemente quebra código que acessa propriedades dinamicamente (obj[key], Object.keys(obj)) a menos que você configure nomes reservados.

Quando minificar: e quando não

  • Faça minificar em produção, em todos os ativos que o navegador baixa.
  • Faça servir um mapa de origem para que as DevTools do navegador ainda possam mostrar nomes originais ao depurar.
  • Não faça minificar em desenvolvimento, você desperdiça tempo de construção e perde erros legíveis.
  • Não faça minificar código já minificado. Arquivos .min.js encolhem cerca de 1-3% na re-minificação, correndo o risco de quebra.

Erros comuns

  • Não configurar nomes reservados. O acesso dinâmico a propriedades (obj["payment_" + type]) quebra quando payment_method é ofuscado para a.
  • Esquecer mapas de origem. Sem arquivos .map, erros de produção são ilegíveis.
  • Minificar CommonJS e ESM juntos. Sistemas de módulos mistos precisam de cuidadosa eliminação de árvore antes da minificação.

Perguntas frequentes

Normalmente 40-70% menor sem compressão, reduzindo mais 60-75% quando comprimido em gzip ou Brotli. Uma fonte de 100 KB frequentemente é enviada como ~15-25 KB pela rede.

A ofuscação padrão (de variáveis locais) é quase sempre segura. A ofuscação agressiva de propriedades quebra qualquer código que acesse propriedades dinamicamente. Configure a lista reserved com cuidado antes de ativá-la.

Sim. Marque “Criar também um source map” e você recebe um arquivo .map junto com o código minificado. Ele liga o código minificado às suas linhas e nomes originais, para que as DevTools do navegador mostrem código e stack traces legíveis. Publique os dois arquivos na mesma pasta: o código minificado termina com um comentário //# sourceMappingURL= que encontra o map pelo nome do arquivo. O map contém seu código original, então publique-o só onde qualquer pessoa possa ler esse código.

Sim. Await de nível superior (em módulos ES), campos de classe, métodos privados, coalescência nula (??), encadeamento opcional (?.) e separadores numéricos são suportados. Decorators não: compile-os antes para JavaScript padrão, assim como TypeScript ou JSX. O minificador nunca converte sintaxe nova para uma versão anterior: a opção de versão do ECMAScript só define a sintaxe mais recente que o código minificado pode usar para economizar bytes.

Não. O código que você cola ou abre é minificado no seu navegador. Ele não é enviado aos nossos servidores nem adicionado ao link da página. Entre as etapas, ele fica no armazenamento de sessão desta aba, que o navegador apaga quando você fecha a aba.

Ferramentas relacionadas

Gerador de cards CSS

Crie um card com seu título, texto e link opcional. Ajuste cores, borda, espaçamento, sombra e efeito ao passar o mouse. Depois copie ou baixe o HTML e o CSS.

Gerador de textura de ruído

Gere uma textura de ruído em SVG que se repete sem emendas, com opacidade, frequência do grão, tipo de ruído e cor de fundo ajustáveis, e copie o CSS já pronto.

Gerador de Configuração Webpack

Crie um webpack.config.js para webpack 5 a partir de um formulário curto: defina o entry, a pasta de saída e o modo, e ative TypeScript, Babel, um loader CSS, HtmlWebpackPlugin e um servidor de desenvolvimento.

Gerador de Docker Compose

Gere um docker-compose.yml a partir de definições de serviços com imagem, portas e volumes, com padrões de boas práticas.

Conversor de base numérica

Converta números entre binário, octal, decimal, hexadecimal e qualquer base personalizada de 2 a 36, com o detalhamento posicional.

Conversor de Tamanho de Arquivo

Converta entre bytes, KB, MB, GB, TB e as unidades binárias IEC (KiB, MiB, GiB, TiB), combinando decimal e binário como preferir.

Ferramenta disponível em outros idiomas