shadcn.io— milhares de blocos shadcn/ui
Ir para o conteúdo

AVIF vs WebP — o arquivo menor nem sempre é o certo

Uma vez passei uma noite constrangedora comparando a mesma imagem de destaque como WebP e AVIF, alternando entre duas abas do navegador, tentando pegar uma diferença que meus olhos de fato conseguissem ver. O AVIF era 31% menor. Eu não conseguia distinguir os dois. Fiquei ali sentado achando que tinha achado dinheiro de graça — e aí rodei o lote numa pasta de 200 imagens e me lembrei do porém.

O AVIF é, na maior parte do tempo, o arquivo menor. Essa parte é verdade e vale saber. Mas "menor" é só uma coluna na planilha, e as outras colunas são onde a decisão realmente mora.

Onde o AVIF ganha

O AVIF é construído sobre o codec de vídeo AV1, e é um projeto genuinamente mais novo e mais esperto que o WebP. Em conteúdo fotográfico ele normalmente fica 15–30% menor que um WebP na mesma qualidade visual. Ele lida com degradês suaves — céus, pele, sombras leves — sem os artefatos quadriculados que codecs mais antigos espalham por cima deles. Ele suporta HDR e gama de cores ampla, o que o WebP não faz. Ele mantém um canal alfa completo, igual ao WebP.

Alguns números aproximados daquela pasta que mencionei, todos num ajuste de qualidade onde eu não conseguia notar diferença:

OrigemWebPAVIF
Uma foto de destaque — PNG de 3,1 MB~360 KB~250 KB
Uma foto de produto — JPG de 1,4 MB~180 KB~140 KB
Uma ilustração de interface chapada~28 KB~30 KB

Olhe essa última linha de novo. Em gráficos chapados e simples, o AVIF às vezes sai maior. A esperteza dele é calibrada para a complexidade fotográfica, e ele não tem nada para trabalhar numa ilustração de duas cores. O WebP, ou até o PNG, pode ganhar ali.

Onde o AVIF cobra de você

O ganho de tamanho não sai de graça. Dois preços reais:

Tempo de codificação. O AVIF é drasticamente mais lento para comprimir. Na mesma imagem, uma codificação AVIF pode levar várias vezes mais tempo que um WebP — às vezes a diferença entre "instantâneo" e "espere alguns segundos por arquivo". Para uma imagem de destaque, tanto faz. Para um lote de 200, você sente cada segundo. O WebP codifica tão rápido que é praticamente de graça.

Decodificação e suporte. Todo navegador que as pessoas de fato usam decodifica AVIF agora — Chrome desde 2020, Firefox pouco depois, Safari a partir da versão 16, no fim de 2022. Em 2026 isso cobre a imensa maioria do tráfego real. Mas "suportado" e "universal" não são a mesma palavra. O WebP tem alguns anos a mais de saturação atrás de si, e decodifica mais rápido em telefones mais fracos, onde a decodificação de AV1 pode custar bateria e CPU perceptíveis. Alguns clientes de e-mail e webviews embutidos mais antigos ainda não abrem AVIF de jeito nenhum.

A questão dos 20%

Então a decisão de verdade se resume a isto: os ~20% extras importam para esta imagem, neste lugar?

Para uma imagem de destaque grande numa landing page — aquele único recurso pesado que todo visitante baixa — sim. Tirar 100 KB da coisa que trava a sua primeira renderização vale uma codificação mais lenta que você paga só uma vez. É o caso mais claro de AVIF que eu conheço.

Para uma grade de miniaturas, os prints inline de um blog, ou qualquer coisa que já esteja abaixo de uns 50 KB como WebP, a resposta costuma ser não. Vinte por cento de um número pequeno é um número menor. Você trocou tempo de codificação e uma fatia de compatibilidade para economizar bytes que ninguém estava esperando. O WebP é o padrão mais tranquilo ali.

Quando eu não me incomodo com AVIF

Se um arquivo vai para qualquer lugar fora de um navegador moderno — uma newsletter por e-mail, um CMS antigo, o sistema de um parceiro que eu não controlo — eu não aposto no AVIF. Uso WebP, ou JPG puro se quiser risco zero. O arquivo menor que não renderiza não vale nada.

E eu não codifico em AVIF gráficos chapados, logos ou line art. Não é para isso que o codec serve, e já vi ele perder para o WebP nesses casos vezes suficientes para parar de tentar.

Como eu decido na prática

Meu fluxo honesto: converto a coisa fotográfica pesada para AVIF e mantenho o material leve, simples e de ampla distribuição como WebP. Não é um formato para reinar sobre todos. É escolher por imagem.

Se você quiser testar a comparação por conta própria, os dois rodam no seu navegador aqui — WebP para AVIF para espremer ainda mais recursos WebP que já existem, e PNG para AVIF para ir direto de um mestre. Nada sobe para lugar nenhum; a codificação acontece na sua máquina, que é também por que você vai sentir a lentidão do AVIF em primeira mão. Isso não é um defeito. É o codec fazendo mais trabalho por um arquivo menor, bem na sua frente.

Passe sua própria imagem de destaque pelos dois. Se você não conseguir ver a diferença e o AVIF for significativamente menor, você tem sua resposta. Só não presuma que a resposta é a mesma para os próximos 200 arquivos.

Artigos relacionados


Todos os artigos