Formatação de código / MULTIVERTO
Compacte os espaços em branco entre elementos SVG.
Aplique cada ferramenta de texto ao resultado anterior. Fluxos de trabalho com texto ↗
Somente o nome da sequência e a ordem das ferramentas são salvos neste navegador. Sua entrada e seus resultados nunca são salvos.
01 / Exemplo
<svg xmlns="http://www.w3.org/2000/svg">
<circle cx="25" cy="25" r="20"/>
</svg><svg xmlns="http://www.w3.org/2000/svg"><circle cx="25" cy="25" r="20"/></svg>02 / Guia
Compacte os espaços em branco entre elementos SVG. A ferramenta remove apenas espaços selecionados; inspecione o resultado quando o espaço em branco tiver significado. A compactação remove nós formados somente por espaços entre formas e grupos, sem alterar os valores dos atributos. Um arquivo de texto menor não garante uma imagem renderizada menor nem carregamento mais rápido. Verifique elementos de texto e referências após usar a saída compacta.
A compactação de SVG preserva a geometria dos caminhos como foi escrita. Isso é importante porque otimizadores visuais fazem muitas decisões adicionais que exigem compreender a imagem renderizada. O editor requer uma simples raiz svg bem formada e recusa declarações, comentários e CDATA. Após a conversão, renderize o arquivo em vários tamanhos e verifique qualquer texto, viewBox e referências.
A compactação é útil quando uma máquina consome o resultado e o recuo para leitura humana é desnecessário. Primeiro verifique se o código fonte não modificado funciona, depois inspecione o que a operação remove. Esta ferramenta não reivindica a mesma redução de tamanho que um minifier de produção: tais ferramentas podem analisar a gramática completa, reescrever identificadores, dobrar constantes ou aplicar compressão após serialização. Aqui a política é conservadora, então uma construção incerta deve permanecer intacta ou causar um erro. No exemplo ao vivo, “<svg xmlns="http://www.w3.org/2000/svg"> <circle cx="25" cy="25" r="20"/> </svg>” se torna “<svg xmlns="http://www.w3.org/2000/svg"><circle cx="25" cy="25" r="20"/></svg>”. Leia a pontuação, bem como as palavras visíveis: essa pequena amostra é um resultado observável desta operação em particular. Altere um recurso que você gosta na fonte e compare o mesmo lugar no resultado. Compare um ícone SVG contendo um título e um elemento de texto antes e depois da compactação. Revise os pixels visíveis e o nome acessível na página de incorporação. Uma string XML menor não é evidência de que a colocação do texto, estilos herdados ou referências a definições sobreviveram a cada otimizador downstream.
Use o formulário compacto ao incorporar um snippet SVG simples em uma página ou comparar ícones serializados. Visualize a imagem após a conversão, incluindo texto e quaisquer referências de URL. Apenas o espaço em branco do layout entre os elementos suportados é removido; caminhos não são simplificados e dimensões de rasterização não são afetadas. Mantenha o código-fonte para edição manual posterior. Mantenha o original ao lado da saída e teste um pequeno exemplo conhecido antes de manipular um documento grande. Compare conteúdo significativo, não apenas o tamanho do arquivo ou o número de linhas. Verifique nomes, strings entre aspas, caracteres não ASCII, terminações de linha e quaisquer campos repetidos após a transformação.
Explorar guias