JPEG XL против AVIF: в тестах для веба AVIF чаще даёт файлы меньше

Автор блога jakearchibald.com отмечает, что JPEG XL теперь поддерживается во всех основных браузерах, и решил сравнить его с другими форматами для веба. Он написал собственный скрипт, который кодирует картинки разными кодеками с разными настройками и записывает результаты. Версии: avifenc 1.4.2, libjxl 0.12.0 (через cjxl), jixel 0.4.2 (второй кодировщик JPEG XL) и cwebp 1.6.0 (для lossless WebP). Большинство тестовых изображений закодированы шириной 1598 пикселей, то есть вдвое больше максимальной ширины картинок в блоге, чтобы они были чёткими на экранах с высокой плотностью. Тесты шли на MacBook Pro 2024 (M4 Pro). Качество измеряли метрикой SSIMULACRA2: 50 считается средним, 70 высоким, 80 очень высоким, 90 визуально без потерь; дополнительно использовалась метрика ColorVideoVDP, которая даёт примерно тот же результат, но сильнее разводит AVIF и JPEG XL.
Главный вывод по фото с потерями: AVIF почти всегда даёт файл меньше. При настройках усилия по умолчанию лучший вариант JPEG XL обычно на 15-25% больше равного по качеству AVIF, при максимальном усилии разрыв сужается до 6-20%. Бывают исключения, где JPEG XL близок к AVIF или даже выигрывает, поэтому для конкретной картинки стоит попробовать оба формата. Кодировщик JPEG XL сильно влияет на результат: более новый jixel обычно делает файлы меньше, чем libjxl, кроме картинок с детальной прозрачностью.
Для скриншотов и иллюстраций AVIF, по словам автора, намного лучше: эквивалентный JPEG XL больше на 30-90% при усилии по умолчанию и на 20-70% при максимальном. AVIF с потерями с ними справляется хорошо, так что кодирование без потерь нужно, только если требуется побитовая точность. Для изображений с прозрачностью версия libjxl больше AVIF на 31-44% по умолчанию и на 61-70% при максимальном усилии; jixel всегда кодирует прозрачность без потерь, из-за чего его файлы в 2-3 раза больше AVIF.
На примере автомобиля Формулы-1 (F1) при настройках по умолчанию лучший JPEG XL на 14-17% больше AVIF при том же качестве. jixel на самом медленном режиме («extraslow») слегка обгоняет AVIF по умолчанию (файлы на 1-10% меньше, максимум выигрыша при очень высоком качестве), но кодируется в 18-27 раз дольше. При настройках по умолчанию jixel кодирует на 12-36% быстрее AVIF и расходует примерно вдвое меньше памяти, но файлы на 14-18% больше; libjxl по умолчанию работает в 1,5-2 раза дольше AVIF и использует в 2-3 раза больше памяти. Декодирование JPEG XL занимает в 2-3 раза больше времени при среднем качестве и около 1,5-1,8 раза при очень высоком; декодер JPEG XL в Safari самый медленный.
Про усилие кодирования: для AVIF оно окупается (режим s5 даёт примерно на 10% меньшие файлы за примерно втрое большее время), для jixel тоже, вплоть до режима «slow» (файлы на 9-13% меньше, чем у режима по умолчанию «fast», за время примерно в 3,7 раза больше). Для libjxl не окупается: максимальное усилие почти не лучше умолчания, но занимает примерно в 18 раз больше времени, а иногда файлы получаются даже больше. Режим AVIF 4:2:0 (половинное разрешение цвета) автор не советует делать режимом по умолчанию: он редко уменьшает файл и мешает достичь высоких качеств, хотя быстрее кодируется и декодируется; без времени на проверку обоих вариантов лучше брать 4:4:4.
Остальное по сводке автора: прогрессивная отрисовка JPEG XL поддерживается в Firefox и Chrome, Safari показывает только финальную картинку; при самом медленном режиме jixel ранние превью почти бесплатны, а по умолчанию файлы на 12% больше. Прогрессивный AVIF пока работает только в Chrome (в Firefox в работе), он сложнее, но даёт больше контроля над превью, файлы обычно меньше, а декодируются быстрее. Для HDR у JPEG XL формально есть карты усиления (gain maps), но браузерные декодеры их не поддерживают, а кодирование нестабильно и экспериментально; при сравнении HDR без карт усиления две метрики сильно расходятся, но сходятся в том, что файлы JPEG XL меньше. Существующие JPEG можно перепаковать в JPEG XL без дополнительных потерь, и они станут на 9-20% меньше. В режиме без потерь JPEG XL явный победитель: lossless WebP на 9-17% больше для фото, lossless AVIF на 30-120% больше; но такие картинки в вебе почти никогда не нужны, а высокие режимы jixel часто дают файлы, слишком медленные для декодирования.
Итог автора: для веба он сейчас по умолчанию брал бы AVIF 4:4:4 с максимальным усилием, на которое хватает терпения, а если AVIF даст необычно большой файл, проверил бы JPEG XL через jixel. Оба формата недавно сильно улучшились, поэтому рекомендация может измениться. Автор также предупреждает, что вокруг темы много дезинформации, и советует проверять форматы на собственных изображениях.
Ключевые факты
- Фото с потерями: лучший JPEG XL обычно на 15-25% больше равного по качеству AVIF при настройках по умолчанию и на 6-20% при максимальном усилии; бывают исключения в пользу JPEG XL.
- Скриншоты и иллюстрации: JPEG XL больше AVIF на 30-90% (по умолчанию) и на 20-70% (максимальное усилие); для прозрачности libjxl больше на 31-44% и 61-70%, а jixel даёт файлы в 2-3 раза больше.
- AVIF быстрее декодируется: JPEG XL тратит в 2-3 раза больше времени при среднем качестве и около 1,5-1,8 раза при очень высоком (на примере F1).
- Побеждает JPEG XL в режиме без потерь (lossless WebP больше на 9-17% для фото, lossless AVIF на 30-120%) и при перепаковке готовых JPEG: файлы меньше на 9-20% без потерь.
- Вывод автора: для веба по умолчанию AVIF 4:4:4 с максимальным терпимым усилием, JPEG XL через jixel как запасной вариант; рекомендация может измениться.
Почему это важно
JPEG XL теперь есть во всех основных браузерах, и у разработчиков появляется вопрос, стоит ли переходить на него с AVIF. Автор отвечает данными по конкретным кодировщикам и версиям. Вывод неожиданный для тех, кто ждёт от нового формата безусловного превосходства: на реалистичных веб-задачах (фото, скриншоты, иллюстрации, прозрачность) AVIF в тестах чаще выигрывает по размеру файла и по скорости декодирования. Автор отмечает, что оба формата недавно сильно улучшились, а вокруг темы много дезинформации.
Кому это важно
Веб-разработчикам и владельцам сайтов, которые выбирают формат изображений и кодировщик. Тем, кто кодирует много картинок на сервере: для них важны время кодирования и расход памяти (jixel быстрее и экономнее AVIF, но файлы заметно больше). Тем, у кого накоплены готовые JPEG: их можно перепаковать в JPEG XL без потерь с экономией 9-20%. Тем, кто работает с HDR, прозрачностью или архивами без потерь.
Как это применить
Рекомендация автора для веба: AVIF в режиме 4:4:4 с максимальным уровнем усилия, который вы готовы ждать. Если AVIF даёт необычно большой файл, попробуйте JPEG XL через jixel. Для libjxl высокие уровни усилия не окупаются, для AVIF и jixel окупаются. Режим 4:2:0 в AVIF не делайте режимом по умолчанию, если нет времени проверить оба варианта. Качество кодировщиков подбирается предсказуемо: при одной настройке качества результат слегка меняется от картинки к картинке, но все кодировщики ведут себя в одном направлении. Главный совет автора: проверяйте на своих изображениях.
Можно ли доверять
Это авторские измерения одного человека на одном компьютере (MacBook Pro 2024 на M4 Pro) и на подобранном им наборе картинок; обобщения даны словом «обычно». Метрики качества (SSIMULACRA2, ColorVideoVDP) автоматические, и сам автор в одном случае сомневается в метрике: при среднем качестве ему кажется, что AVIF и libjxl выглядят лучше версии jixel, где виден шум вокруг логотипа. Подробности по части разделов (скриншоты, прозрачность, HDR, перепаковка JPEG, режим без потерь) в пересказе даны по итоговой сводке автора. Версии кодировщиков названы, так что результаты можно перепроверить.
Риски и подводные камни
Оба формата и их кодировщики быстро развиваются, поэтому цифры могут устареть: автор сам допускает, что рекомендация изменится. Автор оговаривает, что сторонники AVIF считают JPEG XL технически ограниченным, но он сравнивает именно сегодняшние реализации. Результаты зависят от кодировщика: jixel часто даёт меньшие файлы, чем libjxl, но не для детальной прозрачности. Высокие режимы jixel кодируют очень долго (до 18-27 раз дольше AVIF по умолчанию) и расходуют много памяти. Прогрессивная отрисовка JPEG XL не работает в Safari, а AVIF-превью пока только в Chrome. Поддержка карт усиления для HDR в браузерных декодерах JPEG XL отсутствует. Автор также считает анимированные форматы изображений плохой идеей.
«И AVIF, и JPEG XL (через jixel) в последнее время сильно улучшились, поэтому возможно, что эта рекомендация в будущем изменится.»
— автор блога jakearchibald.com