AVIF vs WebP vs JPEG XL in 2026: Which Modern Image Format Wins?

In 2022, JPEG XL looked like the future. The format was the most technically advanced — better compression than AVIF, lossless JPEG transcoding, progressive decode, HDR, animation. Adobe shipped support. Apple shipped support in Safari 17. Then Chrome killed it: the team disabled the experimental flag and removed the code, citing "insufficient industry interest." Three years later, the situation is the same. JPEG XL has Safari and Firefox; Chrome and Edge still don't.

That single decision shapes the 2026 image landscape. AVIF is the technical winner on compression. WebP is the practical winner on tooling and ubiquity. JPEG XL is excellent and locked out of the largest browser market. JPEG itself, 30 years old, refuses to die.

This post is the honest 2026 comparison: file sizes at equivalent quality, browser support, and which to pick for which job.

Why JPEG Won't Go Away

JPEG was standardized in 1992. It compresses photos by transforming 8×8 blocks of pixels into frequency components (the discrete cosine transform), quantizing the high frequencies, and encoding the result. No alpha channel, no animation, 1980s mathematics. By every technical measure it has been beaten for years.

It refuses to die because:

1. Universal support. Every browser, OS, embedded device, camera, and printer reads JPEG.
2. Mature tooling. Decades of encoders with sophisticated optimization (mozjpeg, jpegtran). Encoding is fast.
3. Patent-free baseline. No royalties, no license fees, no encumbrance.
4. Acceptable for the cases people have. Photos of moderate quality and size — the bulk of internet image traffic — look fine.

Modern encoders like mozjpeg produce files 5–10% smaller than libjpeg with no quality loss. For workflows that care about absolute compatibility (email attachments, PDF embedding, legacy CMS), JPEG is still the correct default.

When you're deliberately upgrading, the path most teams take in 2026 is JPEG → WebP. Our JPG to WebP handles the conversion in the browser without uploading the file anywhere.

WebP — Google's Still-Current Default

WebP launched in 2010, derived from the VP8 video codec. It supports lossy and lossless compression, alpha channel, and animation. The strategy is predictive coding: each pixel is predicted from neighbors and only the difference is encoded.

Compression vs JPEG (Google's WebP study):

• Lossy: 25–34% smaller at equivalent SSIM
• Lossless: 26% smaller than PNG
• Animated: 60–80% smaller than GIF

Browser support, May 2026: ~98% global. Every evergreen browser supports it; holdouts are pre-14 iOS Safari and old desktop browsers. WebP is the safest modern choice in 2026.

Trade-offs:

• Encoding is fast — comparable to JPEG, much faster than AVIF
• Quality is good but not best-in-class — AVIF beats it by 15–25% at equivalent SSIM
• Tooling is mature — cwebp, Sharp, ImageMagick, every major library supports it

For the reverse — a WebP someone sent you that needs to load into something that doesn't accept WebP — WebP to JPG handles it.

AVIF — Best Compression but Slow Encoder

AVIF (AV1 Image File Format) launched in 2019, based on the AV1 video codec. The Alliance for Open Media designed it specifically to beat existing image formats on compression — and it does. Compared to JPEG at equivalent SSIM, AVIF is 40–50% smaller. Compared to WebP, 15–25% smaller.

Cloudflare's AVIF deep dive covers the format's strengths. Key features:

• 12-bit color depth (vs 8-bit JPEG/WebP)
• HDR support (PQ and HLG transfer functions)
• Wide color gamut (Rec.2020, P3)
• Better artifact behavior at low bitrates than JPEG/WebP
• Full alpha channel and animation

The downside is the encoder. AVIF encoding via libaom is 5–10x slower than WebP for equivalent quality. SVT-AV1 closes the gap (2–3x slower) but encoding cost shows up in build pipelines and CDN caching.

Browser support, May 2026 (caniuse AVIF): Chrome 85+, Firefox 93+, Safari 16+, Edge 121+. Global ~94%, slightly behind WebP.

For new web deployments in 2026, AVIF with WebP fallback is the leading-edge option. The encoding cost is the main blocker — most static sites pre-generate AVIF at build rather than transcode on the fly.

JPEG XL — The "Should Win But Chrome Killed It" Story

JPEG XL is the technically strongest of the modern formats. It was standardized in 2022 by ISO/IEC and combines insights from JPEG, FLIF, and PIK. Compared to AVIF, it's roughly equivalent on compression (sometimes better, sometimes worse depending on content), with key advantages AVIF doesn't have:

• Lossless JPEG transcoding — convert existing JPEGs to JPEG XL with no quality loss, recovering 18–22% of file size, then transcode back to JPEG bit-perfect if needed. This is unique.
• Progressive decode by default — see a low-quality version after the first ~10% of bytes load
• Faster encode than AVIF — comparable to WebP, much faster than libaom AVIF
• Lossless mode is competitive with PNG — and far better than WebP lossless on photos

Jon Sneyers, one of the format's authors, has written extensively on its design — his JPEG XL technical comparison covers the case for adoption.

The browser support situation in May 2026 is the format's defining problem:

• Safari: supported since 17 (Sept 2023) and remains
• Firefox: behind a flag (image.jxl.enabled); not on by default
• Chrome / Edge: not supported. Removed from Chromium in 2022 with no plan to re-add
• Brave, Opera, Vivaldi: all Chromium-based, so all unsupported

Without Chrome, global support sits around 25%. For server-controlled uses (PDF embedding, RAW photo archive, image storage that decompresses server-side) JPEG XL is excellent. For public web delivery, it's effectively unusable until Chromium reverses course.

Browser Support Matrix, May 2026

The complete picture lives at caniuse.com and updates daily.

File Size Benchmarks at Equivalent Quality

Numbers from various 2024–2026 benchmarks (varies by content; treat as ranges):

For a typical 24-megapixel photograph at perceptually equivalent quality (SSIM ~0.97):

For a UI screenshot with text and graphics (perceptually lossless):

For animated content (10s clip):

The web.dev image format guide has the canonical comparison methodology.

Decision: Which Format for 2026

For most teams, the right answer is "AVIF with WebP fallback" or "WebP with no fallback":

<picture>
  <source srcset="photo.avif" type="image/avif">
  <source srcset="photo.webp" type="image/webp">
  <img src="photo.jpg" alt="Description" loading="lazy" width="800" height="600">
</picture>

Decision shortcuts:

• Static site, performance-conscious, modern audience: AVIF + WebP fallback. Pre-generate at build time.
• CMS-driven site, mixed audience: WebP + JPEG fallback. AVIF only if your CDN handles transcoding (Cloudflare Images, Imgix, Cloudinary).
• User-generated content: WebP for all, generate AVIF lazily on first view, cache aggressively.
• PDF embedding, email attachments, archival: stay with JPEG. Mature, universal, encoder-mature.
• Photo archive, server-controlled, no public delivery: JPEG XL for size and lossless JPEG transcode capability.
• Animated short clips: MP4/WebM video, not WebP/AVIF animation. Smaller, broader player support.
• Lossless screenshots: WebP lossless or PNG. AVIF lossless underperforms on graphics with text.

For format conversion, Image Convert handles JPEG/PNG/WebP/AVIF in the browser. For quality tuning, Image Compress previews at different quality settings. For pixel-dimension changes, Image Resize handles up- and downscaling before format conversion.

For background, see Image Formats Explained, How Image Compression Works, and our WebP migration guide.

FAQ

Is AVIF worth the encoding cost in 2026?

For pre-generated assets on a CDN, yes — encoding happens once, savings repeat per pageview. For on-the-fly transcoding (user uploads converted at request time), the math is harder. Calculate (size_savings_kb × monthly_views) vs (encode_cpu_cost × upload_count). For high-traffic static images, AVIF wins easily. For low-traffic dynamic content, WebP is often more economical.

Why did Chrome remove JPEG XL?

The Chrome team's stated reasons: "insufficient interest from the entire ecosystem," lack of incremental benefits over existing formats, additional code maintenance burden. Critics (including Adobe and Facebook) pushed back, citing measurable benefits. The decision stuck. Without Chromium support, JPEG XL adoption is capped at the ~25% of browsers that aren't Chromium-based.

Should I use AVIF or WebP for hero images?

Both. The <picture> element lets browsers choose: AVIF for those that support it, WebP for those that don't, JPEG for the holdouts. The cost is one extra source line per image; the benefit is 20–40% smaller payloads for ~94% of users. If you can only pick one, WebP — it's the safer choice for older browsers and global coverage.

Does AVIF support transparency?

Yes — AVIF has a full alpha channel and supports lossless or lossy transparency. AVIF with transparency tends to compress better than WebP with transparency, particularly for UI assets with smooth alpha gradients. PNG with transparency remains a fallback if you need older browser support.

Can I convert WebP back to JPEG?

Yes, but every conversion between lossy formats compounds quality loss. Use a high-quality JPEG output (q≥90) to minimize visible artifacts. Our WebP to JPG tool does this in the browser, useful when sending images to systems that don't accept WebP (older email clients, some CMS uploaders).

Is JPEG XL really lossless from JPEG?

Yes — this is the format's standout feature. The transcoding step is bit-exact reversible: a JPEG → JPEG XL → JPEG round trip produces the original bytes. You save 18–22% storage with no quality penalty, and you can always recover the original if needed. For photo archive use (server-side, where browser support doesn't matter), this alone justifies JPEG XL adoption.

Does HEIC matter for the web?

No. HEIC (the Apple iPhone default photo format) is essentially HEIF using H.265 video compression, with patent-encumbered licensing. Web browsers do not support HEIC natively. iPhone uploads typically auto-convert to JPEG. AVIF is the patent-cleaner web equivalent and the format browsers actually adopted.

What about MP4 instead of animated WebP/AVIF?

MP4 (H.264 or H.265) almost always beats animated WebP and AVIF on file size — 30–60% smaller for equivalent quality. Use the <video> element with autoplay muted loop playsinline for "GIF-style" loops. The catch is platform expectations: some social platforms still expect .gif files for the GIF UI pattern. For your own site, MP4 is the right choice for short looping animations.