AVIF vs WebP: por qué AVIF comprime mejor

WebP solía ser la respuesta fácil a "¿cuál es el formato más liviano que puedo usar sin riesgo?" Hoy eso está desactualizado en dos sentidos: AVIF, que viene ganando soporte silenciosamente desde 2020, le gana a WebP en compresión pura en la mayoría de las pruebas del mundo real, y la razón principal por la que la gente todavía lo evitaba —que crear uno era complicado— tampoco aplica ya casi nunca.

Pero "AVIF es más pequeño" es un resumen demasiado tosco. Hay casos concretos y predecibles en los que WebP sigue produciendo el mejor archivo, y saber cuál es cuál ahorra más bytes que tirar siempre del formato más nuevo.

Por qué AVIF comprime mejor

WebP está construido sobre VP8, un códec de vídeo de 2010. AVIF está construido sobre AV1, un códec de vídeo terminado una década después — y los códecs de vídeo son donde de verdad ocurre la investigación en compresión de imagen, porque a escala de streaming incluso una mejora del 1% importa enormemente. AV1 trajo herramientas bastante mejores, y AVIF las hereda todas.

Tres diferencias hacen casi todo el trabajo:

Bloques de tamaño flexible. VP8 trabaja sobre una rejilla bastante rígida. AV1 puede dividir la imagen en bloques que van de diminutos a muy grandes, y elegir por región. Una extensión plana de cielo se describe con un bloque grande en vez de con cientos pequeños; una cara llena de detalle se subdivide tan finamente como haga falta. Ajustar el tamaño del bloque al contenido es de donde sale la mayor parte del ahorro.

Mejor predicción. Antes de guardar nada, ambos códecs adivinan qué aspecto tendrá un bloque a partir de sus vecinos y luego guardan solo el error de esa predicción. AV1 tiene muchas más formas de hacer esa predicción —incluidos modos direccionales que siguen bordes en un abanico amplio de ángulos—, así que el error que tiene que guardar es menor.

Mayor profundidad de bits. AVIF codifica internamente a 10 o 12 bits por canal incluso cuando el origen es de 8 bits. Suena a que debería agrandar los archivos, y en cambio reduce el bandeado: el codificador dispone de gradaciones más finas al aproximar un degradado sutil, así que los cielos y las sombras escalonan menos a igualdad de tamaño.

En la práctica esto se sitúa en el rango del 20-30% a favor de AVIF en fotografías, y las imágenes más grandes y detalladas son las que más ganan. AVIF también admite HDR y gamas de color amplias, que WebP no puede representar en absoluto — no es algo que la mayoría necesite a diario, pero es decisivo en sitios con mucha fotografía.

Dónde sigue ganando WebP

Esta es la parte que se suele omitir.

Imágenes muy pequeñas. AVIF arrastra más sobrecarga estructural por archivo, y por debajo de cierto tamaño esa sobrecarga deja de compensar. Codificando el mismo icono plano a calidad fija, medimos WebP más pequeño a 40 píxeles de lado y por debajo —388 bytes frente a los 427 de AVIF a 32 px, y 352 frente a 417 a 40 px—, y AVIF por delante a partir de 48 px. A esos tamaños el PNG a secas gana a los dos, porque un gráfico plano es justo lo que se le da bien a la compresión sin pérdida. Así que el corte honesto son los favicons y los avatares muy pequeños, no las miniaturas: a 64 px AVIF ya va cómodamente por delante.

Gráficos sin pérdida. El modo sin pérdida de WebP es un diseño excelente hecho a propósito para color plano y bordes nítidos. El modo sin pérdida de AVIF es en comparación una ocurrencia tardía, y en capturas, logotipos y dibujo lineal pierde con frecuencia tanto contra WebP sin pérdida como contra el PNG a secas. Si necesitas una salida exacta píxel a píxel, WebP suele ser la mejor opción moderna.

Tiempo de codificación. AVIF es drásticamente más lento de producir —a menudo varias veces más lento que WebP para la misma imagen—, porque toda esa flexibilidad implica explorar un espacio mucho mayor de codificaciones posibles. Para una imagen es imperceptible. Para una carpeta de cuatrocientas, es la diferencia entre un café y una tarde entera.

Ajustes de calidad muy altos. A medida que empujas la calidad hacia el máximo, la ventaja de AVIF se estrecha y puede invertirse. El casi-sin-pérdida no es el régimen para el que se afinó.

Así que la regla honesta es más estrecha que "AVIF gana": AVIF gana en fotografías, con ajustes de calidad normales y en dimensiones razonables. Da la casualidad de que eso describe la mayoría de imágenes de la mayoría de sitios web, y por eso es un buen valor por defecto — pero no es universal.

La pega que ya casi no es una pega

Lo que impedía que AVIF fuera la opción obvia era esto: todos los navegadores modernos pueden mostrar un archivo AVIF sin problema, pero crear uno directamente en el navegador solo funcionó de forma fiable en Chrome y Edge. Firefox y Safari nunca incluyeron un codificador AVIF nativo, así que las herramientas que dependen del canvas del propio navegador para hacer la conversión producen ahí un resultado distinto, o directamente desactivan AVIF como opción.

Es una limitación real, pero es una limitación de ese enfoque concreto, no de AVIF. img-compress no depende del codificador integrado del navegador: ejecuta su propio codificador AVIF, compilado a WebAssembly, igual que procesa cualquier otro formato. El resultado es una conversión a AVIF que funciona idénticamente en Chrome, Firefox, Safari o Edge, por completo en tu dispositivo y sin subir nada a ninguna parte.

¿Y el soporte de navegadores?

Para ver, ambos están resueltos. Todos los navegadores que siguen recibiendo actualizaciones muestran WebP y AVIF sin necesidad de alternativa. WebP tiene más historia, así que también funciona en una cola más larga de software abandonado, pero si tu audiencia usa algo mantenido esto ya no es una distinción real.

Donde sigue importando es fuera del navegador: los formularios de subida, las aplicaciones de escritorio antiguas, los flujos de imprenta y los gestores de contenido aceptan WebP bastante más a menudo que AVIF, sencillamente porque lleva más tiempo existiendo. Si algo rechaza tu archivo, esa suele ser la razón — y la solución es convertir a JPG o PNG, no cambiar de un formato moderno al otro.

Los números de calidad no son comparables

Esto hace tropezar a casi todo el que intenta comparar los dos con justicia. Calidad 80 en WebP y calidad 80 en AVIF no son el mismo ajuste. Son entradas de codificadores completamente distintos, y cada uno proyecta su escala sobre sus propias decisiones internas. Poner ambos a 80 y comparar los tamaños resultantes dice muy poco, porque casi con seguridad estás comparando dos calidades visuales distintas.

La escala de AVIF en particular tiende a ir "más caliente": un número dado suele producir una imagen visiblemente mejor que ese mismo número en WebP, lo que hace que el archivo AVIF parezca injustamente grande en una comparación ingenua. Si quieres una respuesta real, iguala los dos por aspecto —ajusta hasta que te parezcan equivalentes al tamaño al que los vas a mostrar— y solo entonces compara los bytes.

La misma advertencia vale para cualquier benchmark que leas, incluida la cifra del 20-30% de más arriba. Esos números salen de estudios que igualan cuidadosamente la calidad perceptual primero. Un artículo que pone ambos deslizadores a 75 y reporta la diferencia no está midiendo nada.

Animación

Ambos formatos manejan animación, y los dos demuelen al GIF: el WebP y el AVIF animados son rutinariamente una fracción del tamaño con muchísima mejor profundidad de color, ya que el GIF está atascado en 256 colores.

Entre los dos, el WebP animado es hoy la apuesta segura. El soporte del AVIF animado es más fino que el del AVIF estático, y unos cuantos reproductores y herramientas de vista previa que muestran encantados un AVIF fijo enseñan solo el primer fotograma de uno animado. La ventaja de compresión es real, pero también lo es el riesgo de una animación rota en silencio, y en bucles cortos el ahorro absoluto es pequeño.

Cómo probarlo con tus propias imágenes

Los benchmarks promedian sobre conjuntos de imágenes que probablemente no se parezcan en nada a las tuyas. Diez minutos con tus propios archivos ganan a cualquier artículo, incluido este:

  1. Elige tres o cuatro imágenes que representen de verdad tu trabajo: una foto con mucho detalle, un gráfico plano y algo intermedio.
  2. Convierte cada una a ambos formatos, ajustando la calidad hasta que las dos versiones te parezcan iguales al tamaño al que se van a ver.
  3. Compara los tamaños de archivo y anota qué tipos de contenido muestran una diferencia real y en cuáles da igual.

Normalmente descubrirás que la respuesta depende del contenido exactamente como describe este artículo: una diferencia grande en fotos, mucho más estrecha en gráficos simples, y una inversión en cualquier cosa pequeña.

Decidir, en la práctica

  • Fotos para la web, y no estás codificando cientos de golpe → AVIF. Es el caso en el que mejor está, y es el más común.
  • Capturas, logotipos, dibujo lineal, cualquier cosa con texto → WebP sin pérdida. AVIF es la herramienta equivocada aquí.
  • Favicons y avatares diminutos, del orden de 40 píxeles o menos → WebP, o PNG si es un gráfico plano. Por debajo de ese tamaño la sobrecarga de AVIF pesa más que su eficiencia; a partir de 48 px deja de ser cierto.
  • Un lote muy grande donde importa el tiempo de entrega → WebP. La diferencia de tamaño rara vez justifica multiplicar el tiempo de codificación por varios cientos.
  • Archivar fotos donde manda el coste de almacenamiento → AVIF, y que tarde lo que tenga que tardar.
  • Algo rechazó tu subida → la respuesta es JPG o PNG, no el otro formato moderno.

Pruébalo tú mismo

El conversor de JPG a AVIF de img-compress se encarga de las fotos, el conversor de PNG a AVIF trabaja directamente desde capturas y gráficos, y el conversor de WebP a AVIF parte de un archivo WebP si quieres exprimir lo que quede — los tres funcionan por completo en tu navegador. ¿Necesitas ir en la otra dirección porque el sitio al que subes todavía no se ha puesto al día con AVIF? Los conversores de AVIF a JPG y AVIF a PNG lo resuelven igual de directo, y si lo que buscas es una aceptación más amplia y no compatibilidad máxima, el conversor de AVIF a WebP es un paso atrás más corto que además conserva la transparencia. No se sube nada a ningún servidor, y funciona idénticamente sea cual sea tu navegador. Si estás decidiendo entre formatos de forma más general, WebP vs JPG vs PNG vs AVIF cubre el panorama completo.