🧰 UtlKit

Como Usar o Compressor de Imagens: Re-codificação para JPEG com Qualidade de 10 a 95 de um Arquivo Local, no Navegador

Um arquivo de imagem local, re-codificado para JPEG com qualidade de 10 a 95 em um canvas, com a diferença de tamanho lida de uma estimativa de comprimento base64, tudo calculado no navegador.

O Compressor de Imagens lê um arquivo de imagem local, re-codifica-o como JPEG em um canvas e mostra a mudança de tamanho antes de você baixar qualquer coisa. Você escolhe o arquivo com o seletor, a página o desenha em suas dimensões originais e o canvas re-codifica com a qualidade do controle deslizante, que por padrão está em 70%. A leitura depois imprime o tamanho original, o tamanho comprimido estimado e a porcentagem, por exemplo 2,400,000B → 833,351B (-65%), e uma pré-visualização lado a lado mostra o original junto ao resultado. Tudo é uma chamada de canvas no navegador: os bytes do arquivo nunca saem do dispositivo e não há envio em nenhum ponto.

O que a ferramenta recebe e o que dá

A entrada é um único campo de arquivo que aceita arquivos de imagem e não pede mais nada. O tamanho original é o número exato de bytes do arquivo no disco, então a metade esquerda da leitura é precisa. A saída sempre é um JPEG: o canvas entrega seus pixels ao codificador JPEG do navegador, o formato de saída é fixo e não selecionável, e a largura e a altura ficam exatamente como eram. O único controle é o deslizante de qualidade, que vai de 10 a 95 em passos de 5, ou seja 18 posições, e movê-lo re-codifica na hora o original guardado, de modo que a leitura e a pré-visualização se atualizam ao vivo. Quando o tamanho convence, o botão de download escreve o resultado no seu disco como compressed.jpg; o arquivo que você salva é a verdade para o número real de bytes.

Por que a saída sempre é JPEG

A re-codificação é uma chamada ao canvas cujo tipo de saída vem fixado em JPEG, então um PNG entra e um JPEG sai, um WebP entra e um JPEG sai, e um GIF entra e conserva apenas o primeiro quadro, porque o elemento de imagem só decodifica o primeiro quadro de um arquivo animado. O formato fixo tem duas consequências. Primeira, o JPEG não tem canal alfa, então um PNG transparente não continua transparente: os pixels transparentes são compostos sobre preto antes de codificar, e o arquivo que você baixa tem preto onde a entrada tinha transparência. Segunda, a ferramenta usa o próprio decodificador do navegador sem alternativa, então um formato que o navegador não sabe decodificar, como o HEIC na maioria das plataformas, simplesmente nunca termina de decodificar e a página não mostra nada para ele.

Como o tamanho é lido

O tamanho comprimido é uma estimativa, e deliberadamente simples. O canvas devolve uma URL de dados, um prefixo de 23 caracteres, data:image/jpeg;base64,, seguido de base64, e a página toma o comprimento da cadeia inteira e multiplica por três quartos, porque o base64 usa quatro caracteres para cada três bytes. Essa estimativa supera o número real de bytes só pelo prefixo, o que dá 17 a 19 bytes a mais: um JPEG de 1,000,000 de bytes é lido como 1,000,019B e um de 999,999 como 1,000,016B. Num ciclo completo, um arquivo de 2,400,000B cuja saída do codificador é de 833,333 bytes imprime 2,400,000B → 833,351B (-65%); a porcentagem é arredondada, então o número mostrado e a aritmética exata podem diferir em um ponto.

Quando o arquivo fica maior

A porcentagem de economia é o arredondamento de um menos o tamanho comprimido sobre o original, vezes cem, e um resultado negativo é mostrado com sinal de mais, então um arquivo que cresceu é reportado como, por exemplo, 45,000B → 47,018B (+4%). Isso acontece com imagens pequenas, onde manda a sobrecarga fixa do codificador, com um JPEG que já estava comprimido a uma qualidade igual ou menor que a escolhida, e sempre que o deslizante estiver acima da qualidade a que o original foi salvo. A direção não é um defeito: em 10 a saída é a menor que será e em 95 a maior, então se a leitura sobe ao subir a qualidade, o original já era mais enxuto do que o codificador quer fazer.

Para onde vão os pixels

O arquivo é lido com FileReader como uma URL de dados na página, e o único cálculo é o desenho no canvas mais a codificação JPEG, então os bytes nunca saem do dispositivo e não há nenhuma requisição de rede em nenhum ponto. Também não há persistência: a página guarda a URL de dados só enquanto está aberta, não há histórico nem cache, e fechar ou recarregar a aba descarta a imagem e o resultado. O único artefato que pode sair do dispositivo é o compressed.jpg que você escolhe baixar, e você é quem escolhe.

O que não é

A ferramenta mantém as dimensões da entrada exatamente como são, então não é um redimensionador; mudar o tamanho em pixels é o que o Redimensionador de Imagens faz. Também não é um conversor de formatos, porque a saída vem fixa em JPEG; escolher o formato de saída é tarefa do Conversor de Imagens. Ela não lê nem mostra os metadados do arquivo, que o Visualizador de Informações da Imagem mostra, e não recorta o enquadramento; para isso, veja a guia de recorte.

Ferramentas Relacionadas

Perguntas Frequentes

O Compressor de Imagens envia minha imagem para um servidor?

Não. O arquivo é lido com FileReader como uma URL de dados na página, e o único cálculo é o desenho no canvas mais a codificação JPEG, então os bytes nunca saem do dispositivo e não há nenhuma requisição de rede em nenhum ponto. O único que pode sair é o compressed.jpg que você escolhe baixar.

Por que a transparência do meu PNG sumiu e o fundo ficou preto?

A saída sempre é um JPEG, e o JPEG não tem canal alfa. Antes de codificar, os pixels transparentes são compostos sobre preto no canvas, então o arquivo que você baixa tem preto onde a entrada tinha transparência. Não há nenhum ajuste que guarde a transparência, porque o formato de saída é fixo.

Por que a leitura de tamanho difere alguns bytes do arquivo baixado?

A leitura é uma estimativa: o comprimento da URL de dados, um prefixo base64 de 23 caracteres mais o corpo base64, vezes três quartos, arredondado. Só o prefixo empurra o número 17 a 19 bytes acima da contagem real. O arquivo que você baixa é codificado diretamente do canvas, então é a verdade; trate a leitura como uma pré-visualização da mesma forma, não como uma promessa exata ao byte.

Por que meu arquivo comprimido ficou maior que o original?

A porcentagem de economia pode ficar negativa, e um resultado negativo é mostrado com sinal de mais, por exemplo 45,000B → 47,018B (+4%). Isso acontece com imagens pequenas, onde manda a sobrecarga fixa do codificador, com um JPEG que já estava comprimido a uma qualidade igual ou menor que a escolhida, e sempre que o deslizante está acima da qualidade a que o original foi salvo. Em 10 a saída é a menor e em 95 a maior, então a leitura pode subir ao subir a qualidade.

Qual qualidade eu devo escolher?

O deslizante tem 18 posições, de 10 a 95 em passos de 5, e por padrão está em 70. Movê-lo re-codifica na hora o original guardado, então a leitura e a pré-visualização se atualizam ao vivo; escolha a qualidade mais baixa em que a pré-visualização ainda parece boa para o que você vai usar a imagem, e confira a leitura de tamanho nessa posição.

Artigos Relacionados