Jon Sneyers avatar Jon Sneyers

How JPEG XL Compares to Other Image Codecs

Screenshot of “How JPEG XL Compares to Other Image Codecs”

https://cloudinary.com/blog/how_­jpeg_­xl_­compares_­to_­other_­image_­codecs

With many competing image formats available, it's not always easy to know which one(s) we have to use to provide both the best performance and visual quality to Web users.

With Responsive Web Design, it's even more difficult[1], with the need to provide multiple renditions of these images, at different dimensions, and sometimes even different ratios.

Jon Sneyers — creator of the FLIF format, one of JPEG XL inspirations — shows here how JPEG XL could help reduce complexity with native support for much better compression, great visual quality AND native responsiveness.

Let's hope browsers implement it fast when it reaching a stable status!

  1. Responsive Images are really a difficult topic for Web developers, as feedback on three different talks I gave in 2018 shows. ↩︎

29 Webmentions

6 likes

6 reposts

  1. Mateo Zapata avatar
  2. Jérémie Patonnier avatar
  3. Jyrki Alakuijala avatar
  4. Mithgol the Webmaster avatar
  5. 音風景の管理人 avatar
  6. Jyrki Alakuijala avatar

17 replies

  1. Nicolas Hoizey avatar Nicolas Hoizey
    Sorry, I forgot this link:
    cnet.com/news/apple-ios…
  2. Anthony Ricaud avatar Anthony Ricaud
    Yeah, I wouldn't hold my breath for WebP support.

    Curious, why do you want WebP? It's not better than a JPEG compressed with mozjpeg. (It might even be a worse experience as it does not support progressive rendering)
  3. Jérémie Patonnier avatar Jérémie Patonnier
    I don't really want it, it's just that currently Safari is the last modern browser not supporting it and it would be interesting to understand the official reasoning behind that decision.
  4. Jérémie Patonnier avatar Jérémie Patonnier
    Indeed, JPEG XL looks super promising 😍
  5. Anthony Ricaud avatar Anthony Ricaud
    Ah alright, I didn't understand that from the first question.

    I still don't understand why Mozilla decided to support it :(
  6. Mithgol the Webmaster avatar Mithgol the Webmaster
    You should want WebP because lossless WebP usually offers better compression than PNG or GIF and because animated lossless WebP offers better compression than animated PNG (aka APNG) or animated GIF.
  7. Anthony Ricaud avatar Anthony Ricaud
    I'd argue that SVG is a better alternative for most images suited for PNG. And any form of animations (CSS, SVG, Web Animations) or video would offer a smaller filesize and would be less CPU intensive than an animated WebP.
  8. tom byrer avatar tom byrer
    I think animated WebP is supposed to replace AGIF?
    & there is a CPU cost to SVG, since most browser makers haven't optimized it lately AFAIK. Though animated SVG may be better; I'd like to see hard tests.

    I'd ❣️ to see HEIF support in browsers!

    caniuse.com/#feat=heif
  9. Anthony Ricaud avatar Anthony Ricaud
    HEIF is patent encumbered so there is no chance it will be supported by browsers. As @nhoizey shared earlier in the thread, the best bet for a cross-browser modern image format is JPEG XL. And it's far more interesting than WebP.
  10. pascal massimino avatar pascal massimino
    do you have an example of this bad case?
  11. Anthony Ricaud avatar Anthony Ricaud
    What bad case?
  12. pascal massimino avatar pascal massimino
    the one where mozjpeg does better job than WebP at compressing an image.

    [and btw, i think the blurry look of progressive jpeg being rendered is quite annoying. but that's just me]
  13. Nicolas Hoizey avatar Nicolas Hoizey
    Not just you, I don't like JPEG's progressive rendering either. But I don't like low quality placeholders even more.
  14. Boris Schapira 🚀 avatar Boris Schapira 🚀
    Fight!
  15. Boris Schapira 🚀 avatar Boris Schapira 🚀
    .@HTTPArchive Web Almanac 2021 will be so interesting!
  16. Nicolas Hoizey avatar Nicolas Hoizey
    😅
  17. Nicolas Hoizey avatar Nicolas Hoizey
    Indeed!