AVIF and WebP are the two dominant next-generation image formats for web delivery in 2026. Both compress images significantly better than JPEG and PNG, both support transparency, and both have broad browser support. The choice between them is a trade-off between compression efficiency and encoding speed.
AVIF (AV1 Image File Format) derives its compression from the AV1 video codec developed by the Alliance for Open Media (AOMedia). AVIF typically compresses images 20-30% smaller than equivalent WebP and supports 10-bit and 12-bit color depth for HDR content — capabilities WebP lacks. The catch: AVIF encoding is significantly slower than WebP, particularly at high quality settings.
WebP was developed by Google in 2010, derived from the VP8 video codec. It achieved 25-35% smaller files than JPEG at equivalent quality and became the first widely-adopted next-gen image format. WebP encoding is fast (comparable to JPEG), making it practical for dynamic image generation and CDN conversion pipelines.
Technical Comparison: AVIF vs WebP
| Feature | AVIF | WebP |
|---|---|---|
| Codec basis | AV1 (Alliance for Open Media) | VP8/VP8L (Google) |
| Compression vs JPEG | 50-60% smaller at equivalent quality | 25-35% smaller at equivalent quality |
| Compression vs WebP | 20-30% smaller | Baseline |
| Color depth | 8-bit, 10-bit, 12-bit | 8-bit only |
| HDR support | Yes (10-bit/12-bit + PQ/HLG transfer) | No |
| Wide color gamut (P3, Rec2020) | Yes | Limited (sRGB-optimized) |
| Transparency (alpha) | Yes (lossless alpha option) | Yes (8-bit alpha) |
| Lossless mode | Yes | Yes (VP8L) |
| Animation | Yes (AVIF sequence) | Yes (animated WebP) |
| Encoding speed | Slow (10-50x slower than JPEG) | Fast (comparable to JPEG) |
| Decoding speed | Moderate (hardware decode on new chips) | Fast (hardware decode widely supported) |
| Royalty status | Royalty-free (AOMedia members) | Royalty-free (Google open-source) |
File Size Comparison
These figures are representative estimates; actual compression depends heavily on image content, encoder settings, and quality targets. Your mileage will vary.
| Image Type | JPEG (baseline) | WebP (equiv. quality) | AVIF (equiv. quality) |
|---|---|---|---|
| Photograph (4MP, landscape) | 800 KB | ~560 KB (-30%) | ~400 KB (-50%) |
| Product photo (e-commerce) | 150 KB | ~100 KB (-33%) | ~70 KB (-53%) |
| Screenshot (1920×1080) | 250 KB | ~160 KB (-36%) | ~100 KB (-60%) |
| Portrait photo | 200 KB | ~140 KB (-30%) | ~100 KB (-50%) |
AVIF's advantage over WebP in the 20-30% range is consistent across content types, though it's most pronounced with high-detail photographs. For simple graphics with flat colors, both formats perform similarly and PNG or WebP may be competitive or better.
Browser and Device Support in 2026
| Browser / Platform | AVIF | WebP |
|---|---|---|
| Chrome 85+ (2020) | Full | Full |
| Firefox 93+ (2021) | Full | Full |
| Edge (Chromium) | Full | Full |
| Safari 16+ (macOS Ventura) | Full | Full (Safari 14+) |
| Safari iOS 16+ | Full (hardware on A17+ chips) | Full (iOS 14+) |
| Android (Chrome) | Full (hardware on 2021+ SoCs) | Full |
| Samsung Internet 17+ | Full | Full |
| IE 11 | No | No |
| Chrome 79 (2019) | No | Yes |
| Safari 13 (2019) | No | No |
Global browser support in 2026: AVIF ~92%, WebP ~97%. The 5% gap is primarily older Safari and some legacy Android browsers. Both require a JPEG/PNG fallback for maximum compatibility. The HTML5 <picture> element handles this cleanly.
Encoding Speed: The Practical Constraint
Encoding speed is AVIF's biggest limitation for real-world deployment:
| Format | Relative encoding time | Notes |
|---|---|---|
| JPEG | 1× (baseline) | Near-instant for typical images |
| WebP (quality 80) | 2–4× | Fast enough for dynamic generation |
| AVIF (quality 60, speed 6) | 10–20× | Practical for batch processing |
| AVIF (quality 80, speed 4) | 40–80× | Too slow for on-demand generation |
| AVIF (quality 90, speed 2) | 100–200× | Offline batch only |
AVIF encoding speed has an 0-10 speed parameter (0=slowest/best compression, 10=fastest/worst compression). Speed 6-8 is practical for batch workflows with acceptable quality. For real-time dynamic image generation (on-demand CDN conversion, responsive images from user uploads), WebP is currently more practical unless you have parallel encoding infrastructure.
Tools like libavif, FFmpeg, and ImageMagick all encode AVIF. For production: Squoosh (browser), Sharp (Node.js), Pillow (Python), and ImageMagick all handle both formats.
Use Case Decision Matrix
| Use Case | Best Choice | Why |
|---|---|---|
| Static site pre-built images | AVIF + WebP fallback | Encode AVIF offline; serve to capable browsers for 50% savings |
| Dynamic image resizing (CDN) | WebP (primary), AVIF (where fast enough) | WebP encoding is 10-20x faster; most CDNs support it natively |
| E-commerce product photos | AVIF where possible + WebP fallback | AVIF's 50% savings vs JPEG meaningfully cuts page weight |
| User-uploaded photo processing | WebP | Real-time encoding; AVIF too slow without dedicated hardware |
| HDR photography for web | AVIF | Only web-native format with 10-bit HDR support |
| Animated images | WebP or AVIF | Both support animation; WebP more widely supported currently |
| Maximum compatibility (no fallback) | WebP | 97% support vs AVIF's 92% |
Serving Both Formats: The HTML5 Picture Element
For maximum efficiency and compatibility, serve AVIF with WebP and JPEG fallbacks using the HTML5 <picture> element:
<picture>
<source srcset="image.avif" type="image/avif">
<source srcset="image.webp" type="image/webp">
<img src="image.jpg" alt="Image description" loading="lazy">
</picture>Browsers pick the first source they support. Chrome/Firefox/Edge users get AVIF (best compression). Safari users get WebP (2nd best). Legacy browsers get JPEG (universal). This approach requires storing 3 versions per image but maximizes performance across your entire user base.
Convert to AVIF or WebP with ChangeThisFile
ChangeThisFile supports conversion to both AVIF and WebP from common source formats. Convert your JPEGs or PNGs to next-gen formats via /jpg-to-avif, /jpg-to-webp, /png-to-avif, and /png-to-webp.
curl -X POST https://changethisfile.com/v1/convert \
-H "Authorization: Bearer YOUR_API_KEY" \
-F "file=@photo.jpg" \
-F "target=avif" \
-o photo.avif690 routes supported. Free for 1,000 conversions/month.