Sem upload, 100% local, sem conta

Minificar / Embelezar

Minifique ou embeleze código. Tudo fica no seu navegador.

Como o Minificar / Embelezar funciona

Minificar / Embelezar comprime HTML, CSS e JavaScript removendo comentários, espaços em branco desnecessários e caracteres redundantes, ou expande código minificado de volta para uma forma indentada legível. Todo o processamento acontece no navegador usando parsers incluídos; nada que você cola é transmitido para lugar nenhum. Nada que você digitar aqui sai do seu dispositivo.

A minificação afeta diretamente o desempenho do carregamento da página: arquivos menores transferem mais rápido, analisam mais rápido e consomem menos largura de banda. Para implantações de produção, ativos minificados são padrão. Esta ferramenta é útil quando você recebe um arquivo minificado que precisa ler (embelezar), quando quer verificar o que um minificador faz com um snippet antes de integrá-lo a um pipeline de build, ou quando precisa de uma minificação rápida sem configurar uma ferramenta de build.

Escrito por Bastien Sulyan

Como usar o Minificar / Embelezar, passo a passo

  1. Cole seu código HTML, CSS ou JavaScript na área de entrada.
  2. Selecione o tipo de linguagem no menu suspenso (HTML, CSS ou JavaScript).
  3. Clique em 'Minificar' para produzir a versão comprimida, ou em 'Embelezar' para expandir e indentar o código.
  4. Copie o resultado da área de saída usando o botão de cópia.
  5. Cole código diferente e repita conforme necessário.

Casos de uso comuns

  • Um desenvolvedor front-end quer minificar um snippet CSS crítico para incorporá-lo no head do HTML para desempenho acima da dobra.
  • Um desenvolvedor recebe um script de terceiro minificado e precisa embelezá-lo para entender sua lógica durante uma revisão de segurança.
  • Um redator técnico precisa de uma versão formatada de uma tag script JSON-LD minificada para incluir na documentação.
  • Um desenvolvedor web verifica a economia de bytes ao minificar um arquivo CSS antes de decidir se adiciona uma etapa de build.

Perguntas frequentes

O código que colo é enviado para algum servidor para minificação?

Não. A minificação e o embelezamento são feitos pelo próprio código da página, escrito para esta ferramenta em vez de vir de um minificador de terceiros. Todo o processamento permanece na aba do navegador. Nada que você cola aqui é transmitido ao Sunasty ou a terceiros.

A minificação de JavaScript preserva o comportamento original do código?

Um bom minificador preserva o comportamento removendo apenas espaços em branco, encurtando nomes de variáveis dentro de um escopo controlado e removendo comentários. Esta ferramenta visa transformações seguras. Otimizações agressivas como eliminação de código morto ou inlining de funções geralmente não são aplicadas, pois requerem análise completa do programa.

Posso minificar e depois embelezar o resultado para verificá-lo?

Sim. Primeiro minifique o código, depois cole a saída minificada de volta na entrada e clique em Embelezar. A versão embelezada parecerá diferente do código-fonte original (nomes de variáveis podem ser encurtados, comentários removidos), mas será estruturalmente equivalente.

A minificação HTML remove todos os comentários?

A ferramenta remove comentários HTML padrão (<!-- ... -->) durante a minificação. Comentários condicionais usados por versões antigas do IE (<!--[if IE]...-->) são sempre preservados, então remover comentários não pode quebrar comportamentos legados que dependam deles.

Há um limite de tamanho para o código que posso minificar?

O limite é a memória disponível na aba do navegador. Código de até algumas centenas de kilobytes é processado rapidamente. Para grandes bundles JavaScript (megabytes), uma ferramenta de build dedicada como esbuild, Terser ou Lightning CSS é mais rápida e mais adequada para uso em produção.