Condições de comparação e métodos de reprodução
Na execução de exemplo, escolha uma imagem composta com texto e um centro sólido ou textura. Os dois materiais não são sessões de fotos, mas sim imagens de teste em 1600×900 desenhadas pelo site. Crie o PNG original primeiro, mantenha o tamanho do pixel igual e salve-o como JPEG, qualidade WebP 75, 85 e 95, respectivamente. Você também pode baixar o arquivo de saída diretamente.
O número de bytes na tabela é o Blob.size do arquivo real gerado. O número de qualidade é uma configuração do codificador e não significa que qualquer porcentagem da informação original será retida. Se o seu navegador não suportar o formato, ele falsificará os resultados com uma extensão diferente e não os salvará e exibirá um erro de execução.
Tente executá-lo diretamente sem um arquivo
Executa o código de processamento da ferramenta real com material de exemplo criado pelo site. Os resultados são atualmente calculados no navegador e nenhum dado de entrada é carregado no servidor.
exibe resultados e arquivos de exemplo.
Os exemplos não são dados ou desempenho reais do visitante. O tamanho do arquivo e o formato da fonte podem variar dependendo do navegador, dispositivo e fonte.
2026-10-01 Exemplo de verdade em um ambiente de navegador único
Os valores abaixo foram medidos usando duas imagens compostas idênticas do exemplo em execução acima. Pode variar dependendo do navegador e não tem como objetivo generalizar o tamanho de arquivo esperado das fotos reais ou a superioridade ou inferioridade de cada formato. O tamanho do pixel é 1600×900 em cada linha.
| Tipo de entrada | Formato de saída | Qualidade | Bytes reais |
|---|---|---|---|
| Monocromático | PNG | — | 57379 |
| Monocromático | JPEG | 75 | 30914 |
| Monocromático | JPEG | 85 | 36131 |
| Monocromático | JPEG | 95 | 48342 |
| Monocromático | WebP | 75 | 10872 |
| Monocromático | WebP | 85 | 13114 |
| Monocromático | WebP | 95 | 18858 |
| Textura | PNG | — | 941654 |
| Textura | JPEG | 75 | 263962 |
| Textura | JPEG | 85 | 321468 |
| Textura | JPEG | 95 | 449142 |
| Textura | WebP | 75 | 213200 |
| Textura | WebP | 85 | 267302 |
| Textura | WebP | 95 | 363228 |
| Textura/meta de 200 KB | JPEG | 55 | 197656 |
| Textura/meta de 200 KB | WebP | 65 | 198788 |
O que há de diferente no resultado desejado de 200 KB?
Uma linha separada de 200 KB usa a função de navegação para reduzir o tamanho real da imagem. A qualidade inicial é 85, a qualidade mínima é 50, o lado longo máximo é 2048px e reduções adicionais são permitidas. 200 KB é menor que 200.000 bytes. Altere a qualidade primeiro e reduza o tamanho do pixel se exceder o alvo, então verifique a largura e a altura do resultado juntos.
A linha de comparação 75·85·95 não é uma experiência para atingir a capacidade alvo. Este é o resultado da alteração das configurações de qualidade para o mesmo tamanho. Se você determinar que a taxa de compactação é melhor misturando-a com a linha de destino, as condições de comparação serão diferentes.
Qualidade e ordem de confirmação para aplicar aos meus arquivos
- As fotos começam na qualidade 85 e aumentam o zoom para verificar letras e contornos.
- Se o tamanho do arquivo for pequeno o suficiente, compare-o com o resultado 95 para determinar se alguma diferença nos detalhes é necessária.
- Se o tamanho for muito grande, compare 75, mas verifique também o tamanho mínimo de pixel exigido pela fonte de envio.
- Se pequenos textos, diagramas ou logotipos forem importantes, compare o original PNG com os resultados JPEG/WebP.
- Não uso o tamanho do arquivo do exemplo como o tamanho esperado para minha foto.
Documento de processamento de qualidade/formato Canvas toBlobdescreve diferenças nas configurações de qualidade e no tratamento de formatos não suportados.
Perguntas frequentes
Se a qualidade for a mesma, todas as fotos terão o mesmo tamanho?
Não. Depende do tamanho do pixel, conteúdo da imagem, formato de saída e codificador do navegador.
Se eu aumentar de 85 para 95, a qualidade da imagem melhorará em 10%?
Não pode ser interpretado dessa forma. Não se refere a uma proporção de qualidade de imagem em comparação com o original ou a uma quantidade linear de melhoria.