HTML Minifier — Minificador de HTML

Como funciona a minificação de HTML

A minificação de HTML remove tudo o que o navegador não precisa para renderizar uma página: indentação e quebras de linha entre as tags, comentários, valores de atributos redundantes e atributos padrão. Esta ferramenta usa o html-minifier-terser, que analisa o seu código em tags e texto, aplica as otimizações selecionadas e o grava novamente. Collapse whitespace une sequências de espaços e remove o espaço em branco entre elementos de bloco, mantendo os espaços simples que separam o texto inline. O conteúdo dentro de <pre> e <textarea> não é alterado, pois ali os espaços em branco importam. Remove comments elimina as anotações dos desenvolvedores, e os minificadores inline reduzem os blocos <style> e <script> incorporados com clean-css e Terser.

Os indicadores de tamanho mostram o tamanho em bytes UTF-8 da entrada e da saída e a porcentagem economizada. Templates escritos à mão, com muita indentação, costumam diminuir 15–30%, e mais ainda quando contêm scripts ou estilos inline grandes. Os servidores normalmente comprimem o HTML novamente com gzip ou Brotli, então a economia de transferência é menor que o número bruto, mas um documento menor ainda é analisado mais rápido e mantém compacto o código inline crítico.

Como escolher as opções certas

Remove redundant attributes é um conjunto de limpezas seguras: encurta atributos booleanos como disabled="disabled" para disabled, remove valores padrão como type="text" em inputs e type="text/javascript" em scripts, descarta atributos vazios e substitui doctypes antigos e longos por <!doctype html>. Remove optional tags omite tags de fechamento como </li>, </p> e </body>, que a especificação HTML permite que os navegadores deduzam. Remove attribute quotes elimina as aspas em valores que não precisam delas. Ambas produzem HTML válido, mas podem surpreender outras ferramentas que leem o seu código, por isso vêm desativadas por padrão.

Privado por design

O minificador é carregado sob demanda e roda localmente, portanto os seus templates, o código de e-mails e as páginas de destino nunca são enviados. Isso o torna prático para tarefas pontuais, como reduzir um e-mail em HTML, um trecho de incorporação ou uma página estática antes de colá-los em um CMS. Se o analisador relatar um erro, verifique se há tags não fechadas ou sinais de menor e maior soltos na entrada. Em sites de produção, mantenha a minificação no seu pipeline de build para que o resultado seja reproduzível.