¿Qué son los formatos de nueva generación?

Los formatos de imagen de nueva generación son formatos más recientes, como WebP, AVIF y JPEG XL, que buscan una mejor compresión, funciones adicionales o ambas cosas. El término es informal y cambia a medida que evolucionan los formatos y su compatibilidad.

Cómo funcionan los formatos de nueva generación

La expresión proviene en gran medida de Lighthouse, y muchos desarrolladores la encuentran en su auditoría «Serve images in next-gen formats». La lista que engloba la etiqueta ha cambiado: Lighthouse 6 describía los formatos como JPEG 2000, JPEG XR y WebP, mientras que Lighthouse 12 menciona WebP y AVIF. La documentación de Chrome ahora titula la auditoría «Serve images in modern formats» e indica que pasó a formar parte del análisis «Improve image delivery» a partir de Lighthouse 13. JPEG XL (ISO/IEC 18181) también suele incluirse. Los formatos candidatos difieren considerablemente en los modos con y sin pérdida, el manejo del canal alfa, la animación, el alto rango dinámico y los metadatos, y su adopción depende de los codificadores, navegadores, sistemas operativos y herramientas de edición, no solo de su antigüedad.

Datos clave

  1. En un informe de Lighthouse, la etiqueta tiene un significado preciso. Lighthouse 12 evalúa las respuestas de imagen que el navegador realmente cargó: examina solo las identificadas como BMP, JPEG o PNG e incluye una en la lista cuando su ahorro estimado con AVIF es de al menos 8.192 bytes. Por tanto, una imagen servida como JPEG XL deja de aparecer en la lista porque no se examina, no porque se considere moderna, y cuando un navegador omite un <source> JPEG XL y carga el JPEG de respaldo, ese JPEG sí se examina. El ahorro es el tamaño de la imagen cargada menos un tamaño AVIF estimado que no procede de un codificador AVIF: la estimación es el promedio entre la mitad del tamaño de un nuevo encoding JPEG con calidad de 0,92 y el 80 por ciento de un nuevo encoding WebP con calidad de 0,85, ambos solicitados al navegador; para imágenes de más de 2.000 KiB, o una vez que se han dedicado 5 segundos a volver a aplicar encoding, se calcula únicamente a partir de las dimensiones en píxeles. Considera los ahorros indicados como una señal que debes verificar.
  2. Los formatos tienen diseños diferentes; no son envoltorios intercambiables. AVIF almacena imágenes codificadas con AV1 en un archivo HEIF. WebP es un contenedor RIFF que contiene datos VP8 con pérdida o WebP sin pérdida. JPEG XL tiene su propio flujo de código y formato de archivo basado en bloques y, de los tres, es el único que puede transcodificar sin pérdida un JPEG existente y restaurar después el archivo JPEG idéntico.
  3. La compatibilidad de los navegadores debe comprobarse por formato y por función. Según los datos de caniuse, WebP es totalmente compatible con Safari desde la versión 16.0, mientras que las versiones de Safari 14.0 a Safari 15.6 requieren macOS 11 o posterior; AVIF está disponible desde Chrome 85 y Firefox 93, pero la compatibilidad completa solo llega con Safari 16.4 y Edge 121. MDN indica compatibilidad con JPEG XL desde Chrome 155, Edge 155, Firefox 158 y Safari 17; caniuse coincide, salvo que aún no incluye Edge 155 y señala que la compatibilidad de Safari es parcial: solo imágenes estáticas, sin decodificación progresiva. En un elemento <picture>, el navegador omite cualquier <source> cuyo type no admita, lo que permite que funcione una alternativa JPEG o PNG.
  4. La decodificación en los navegadores dice poco sobre el resto de la cadena de herramientas. La documentación de Pillow, por ejemplo, indica que solo guarda AVIF de 8 bits y decodifica todos los AVIF como RGB o RGBA de 8 bits, y la documentación de sharp indica que no se admiten secuencias de imágenes AVIF. Comprueba por separado los editores, las herramientas de metadatos y las bibliotecas del lado del servidor para cada función de la que dependas.
  5. Un archivo de salida más pequeño depende del contenido. MDN señala que WebP con pérdida es, en promedio, entre un 25 y un 35 por ciento más pequeño que JPEG con niveles de compresión visualmente similares, y que WebP sin pérdida suele ser un 26 por ciento más pequeño que PNG, pero los promedios no se aplican a todas las imágenes: los colaboradores de libavif describen AVIF sin pérdida como eficiente para imágenes de tipo fotográfico y prevén que su rendimiento sea mucho peor que el de WebP sin pérdida con contenido gráfico. Compara las opciones con tus propias fotografías, gráficos e imágenes transparentes, con la calidad que piensas entregar.

Cuándo son importantes los formatos de nueva generación

Sirve un formato más reciente cuando las mejoras de tamaño y calidad medidas en tus propias imágenes justifiquen el encoding y el almacenamiento adicionales. Mantén una alternativa JPEG o PNG, por ejemplo mediante un elemento <picture> cuyas entradas <source> declaren su tipo de medio, porque la compatibilidad de los navegadores, los decodificadores, las herramientas de edición y las herramientas de metadatos puede variar.

Cómo ayuda Transloadit con los formatos de nueva generación

La tabla de formatos de imagen de Transloadit incluye WebP, AVIF y JPEG XL (JXL) como formatos que sus Robots basados en ImageMagick, incluido /image/resize, pueden leer y escribir, y el parámetro format de ese Robot acepta cualquier formato que la tabla marque como compatible con la escritura.

La tabla está paginada y ordenada por nombre, por lo que la fila de WebP aparece en una página posterior. La documentación de /image/resize describe su parámetro quality solo para JPG y PNG, así que compara el tamaño y la calidad de la salida con tus propias imágenes.

Explora los formatos de archivo y las capacidades de compresión de Transloadit

Fuentes

Convierte tus conocimientos sobre multimedia en un pipeline funcional

Conecta las subidas, el procesamiento, la IA, el almacenamiento y la entrega mediante una sola API declarativa, mientras nos encargamos por ti del stack de encoding, el escalado y los cambios constantes de formatos.

Prueba Transloadit gratis