Imagem para Base64

Um conversor de imagem para Base64 codifica um arquivo de imagem como texto — o URI de dados (data:image/png;base64,iVBORw0…) que incorpora a imagem diretamente em HTML, CSS, JSON ou JavaScript em vez de referenciar um arquivo separado. A imagem se torna parte do código.

A troca é entre solicitações versus bytes: uma imagem embutida salva uma solicitação HTTP (uma vez significativa, menos significativa no HTTP/2+), mas custa cerca de 33% de sobrecarga de tamanho (taxa de codificação do Base64) e perde o cache independente. O ponto ideal é pequeno: ícones, logotipos minúsculos e imagens de espaço reservado em alguns KB embutidos; fotos, não.

Faça upload da imagem e copie seu URI de dados Base64.

Onde o inlining ganha seu lugar: pequenos ícones e decorações em CSS (uma folha de estilo, nenhuma solicitação extra — o uso clássico), HTML independente de arquivo único (modelos de e-mail onde imagens vinculadas são bloqueadas, documentos off-line, demonstrações de código em sandboxes), imagens dentro de cargas úteis JSON (APIs e configurações que devem conter uma imagem em texto) e prototipagem rápida sem hospedagem de ativos. O caso do e-mail é proeminente: as imagens incorporadas são exibidas sem a opção "carregar imagens?" portão - embora a disciplina de tamanho seja duplamente importante.

A regra de julgamento: menos de ~5 KB, embutido livremente; 5–20 KB, considere; além disso, hospede o arquivo – a sobrecarga de 33% mais o cache perdido superam a solicitação salva. E observe que os URIs de dados incham visivelmente o arquivo que os contém: uma folha de estilo contendo dez ícones embutidos os usa em seu tamanho. Os arquivos são convertidos e devolvidos, não armazenados.