Softonic

Minificador de JavaScript

Etapa 1 / 3
Próximo

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 Deleta // e /* */ (exceto !important)
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
Compressão de literais de string Mescla constantes de string repetidas

Modo seguro vs agressivo

  • Seguro mantém nomes de variáveis, apenas remove espaços em branco. 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["prop"], 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_method"]) 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, ative “gerar mapa de origem” e a ferramenta retorna o código minificado mais um arquivo .map que mapeia cada byte de volta à fonte original. Faça o upload de ambos para o seu CDN para que as DevTools possam mostrar rastros de pilha legíveis.

Sim, await de nível superior, campos de classe, métodos privados, coalescência nula, encadeamento opcional e separadores numéricos são todos suportados. Para propostas muito novas (decoradores estágio-3), verifique a flag específica.

Ferramentas relacionadas

Referência da Tabela ASCII

Tabela ASCII completa de 0 a 127 com valores decimais, hexadecimais, octais e binários e notação de referência numérica HTML, incluindo NUL, LF e DEL.

Referência de Caracteres HTML

Lista pesquisável de entidades HTML, seus códigos nomeados e numéricos, e uma cópia com um clique para caracteres e símbolos especiais.

Referência de atalhos de teclado

Pesquise atalhos padrão documentados do VS Code, Chrome e Bash com GNU Readline no macOS, Windows e Linux.

Gerador de EditorConfig

Gere um arquivo .editorconfig com suas regras de estilo e tamanho de indentação, fim de linha, charset e espaços em branco para formatação consistente entre IDEs e editores.

Validador de Email

Valide um endereço de email: verificação de sintaxe RFC 5322, consulta de registro MX em tempo real, além de detalhes de parte local, domínio e comprimento. Nenhum email é enviado.

Formatador de HTML

Formate HTML localmente no navegador com indentação de dois ou quatro espaços. O HTML não é enviado nem validado.

Ferramenta disponível em outros idiomas