4 ms·

This presentation covers why AVIF isn't a great replacement for JPEG-- mostly that it's slow, complicated, and lacks a progressive mode. https://www.slideshare

This presentation covers why AVIF isn't a great replacement for JPEG-- mostly that it's slow, complicated, and lacks a progressive mode. https://www.slideshare.net/cloudinarymarketing/imagecon-2019-jon-sneyer https://www.slideshare.net/cloudinarymarketing/imagecon-2019...

thaumasiotes 7y ago
Why would the lack of a progressive mode matter? How is a progressive mode better than a "loading..." spinner?
- nsomaru 7y ago
  The theory goes that it’s better to show the user something resembling the final image than showing them a generic loading spinner.
- est31 7y ago
  The talk is by the FLIF author. One of the big marketing points for FLIF is its progressive mode. Of course every other codec will be criticized for not having one.
- jstummbillig 7y ago
  Progressive mode is better than a loading spinner in the same way that PWAs are better than a loading spinner: By getting mostly usable content in as little time as possible to the user you decrease perceived wait, you decrease time to interactive and you increase perceived loading speed (even though time to full load might be the same or slightly increased).
  - GoblinSlayer 7y ago
    Did you confuse terminology? Web progressive is sort of an antonym to graphics progressive.
    - jstummbillig 7y ago
      How so? Progressive JPEGs load in multiple passes. The first pass trades fidelity for speed, successive passes add quality over time. Seems pretty much in line with what PWA is all about.
  - mrob 7y ago
    In the common case that you don't actually care about the picture, you decrease actual wait, not just perceived. Progressive mode lets you ignore it before it's fully loaded.
    - TheRealPomax 7y ago
      true progressive mode actually gives you something usable before it's fully loaded, to the point where "not fully loading" can be entirely acceptable. If all images load "first iteration" first, you have a stable DOM that won't need to reflow in any way as each image goes through the rest of its progressive layers. And having a nice setting that says "only load up to X on slow networks" and "require image click to load past first iteration" would be godsend, even on gigabit connections. If I could bring the size and load time for modern webpages back down to "maybe a few 10s of kb" and "immediate" rather than "2.9MB and a second or two", I'd happily turn those options on.
    - thaumasiotes 7y ago
      > Progressive mode lets you ignore it before it's fully loaded. Huh? It's obviously easier to ignore the spinner than to ignore a low-res image. You've seen the spinner before.
      - mrob 7y ago
        Progressive mode doesn't need JavaScript.
  - supportlocal4h 7y ago
    Progressive photos always irritate me. The photo comes on my screen all blurry and out of focus and I'm disappointed that the moment I thought I had captured didn't turn out. Then, 3 seconds later, the picture changes and gets slightly better. Then I'm hopeful, but disappointed again. Then i think, "maybe it's not loaded yet", so i wait and hope. Then 2 seconds later it changes again. Is it done? Is it loaded now? Will it get better? Is my computer just dog slow? How long should I wait before I assume it's as good as it's going to get? I know it's a small thing and doesn't really matter, but I don't like progressive photos. Edit: This is just one context. There are plenty of other contexts where progressive is very useful.
    - TheRealPomax 7y ago
      On the other hand, it also doesn't constantly change the DOM, moving you across the page because images above what you're reading are getting swapped in and now you're looking at the paragraph above the one you were reading. and again. oh, and again. and-
      - gardaani 7y ago
        Fixing jumping pages doesn't require progressive image formats. All browsers soon support setting default aspect ratio for all images: https://twitter.com/jensimmons/status/1220114427690856453 https://twitter.com/jensimmons/status/1220114427690856453
    - ksec 7y ago
      The progressive mode in Jpeg and JPEG XL is quite different, because the quality is so much better your perception of it changes. Where Progressive Jpeg are literally useless before it finish loading, JPEG XL provides decent quality.
      - supportlocal4h 7y ago
        I'm curious to see it. My irritation is really just when I actually care about the picture. When I'm specifically browsing my library, for instance. When it's the background for some webpage, or some other photo I'm not focused on, the progressive quality is probably a good thing.
  - thaumasiotes 7y ago
    > By getting mostly usable content in as little time as possible to the user you decrease perceived wait See, this is the issue. Progressive images aren't "mostly usable content"; they're vague, ugly blobs.
    - spider-mario 7y ago
      It entirely depends on what progressive steps you define / where you stop loading.
- ChrisLomont 7y ago
  Systems that render low res can download the prefix of the file and show an image, and stop there. Many modern image formats support this for precisely this reason. If you then want higher quality for some particular image, you can download more, not having to start over with a separate image file.
- TheRealPomax 7y ago
  I'd by far rather see several full article-appropriately sized sideline image at only progression step 1 or 2 out of 5 or 6, than several empty boxes all showing spinners while the images load in. Plus I'd love the ability to say "I'm on a low bandwidth, $$$ per megabyte network, stop loading any image after the first iteration until I indicate I want to see the full one" because you almost never need full-progression-loaded images. They just make things pretty. Having rudimentary images is often good enough to get the experience of the full article. (whether that's news, or a tutorial, or even an educational resource. Load the text and images, and as someone who understands the text I'm reading, I can decide whether or not I need the rest of that image data after everything's already typeset and presentable, instead of having a DOM constantly reflow because it's loading in more and more images)
- nathan_long 7y ago
  Imagine this: you set your browser to download only the first N bytes of each image, showing you a decent preview. If you want more detail on a particular image, you tap it, and the browser requests the next N bytes (or the rest of the file, if you prefer). And to enable this, the site only needed to create one high-resolution image. Seems like a victory for loading speeds, for low-bandwidth, and for content creation. I think FLIF looks incredible.
  - edflsafoiewq 7y ago
    Agreed, but is it likely? Does any browser implement the even simpler feature "Show a placeholder for images. Tap the placeholder to load the actual image"?

thaumasiotes 7y ago

Why would the lack of a progressive mode matter? How is a progressive mode better than a "loading..." spinner?

nsomaru 7y ago
The theory goes that it’s better to show the user something resembling the final image than showing them a generic loading spinner.
est31 7y ago
The talk is by the FLIF author. One of the big marketing points for FLIF is its progressive mode. Of course every other codec will be criticized for not having one.
jstummbillig 7y ago
Progressive mode is better than a loading spinner in the same way that PWAs are better than a loading spinner: By getting mostly usable content in as little time as possible to the user you decrease perceived wait, you decrease time to interactive and you increase perceived loading speed (even though time to full load might be the same or slightly increased).
- GoblinSlayer 7y ago
  Did you confuse terminology? Web progressive is sort of an antonym to graphics progressive.
  - jstummbillig 7y ago
    How so? Progressive JPEGs load in multiple passes. The first pass trades fidelity for speed, successive passes add quality over time. Seems pretty much in line with what PWA is all about.
- mrob 7y ago
  In the common case that you don't actually care about the picture, you decrease actual wait, not just perceived. Progressive mode lets you ignore it before it's fully loaded.
  - TheRealPomax 7y ago
    true progressive mode actually gives you something usable before it's fully loaded, to the point where "not fully loading" can be entirely acceptable. If all images load "first iteration" first, you have a stable DOM that won't need to reflow in any way as each image goes through the rest of its progressive layers. And having a nice setting that says "only load up to X on slow networks" and "require image click to load past first iteration" would be godsend, even on gigabit connections. If I could bring the size and load time for modern webpages back down to "maybe a few 10s of kb" and "immediate" rather than "2.9MB and a second or two", I'd happily turn those options on.
  - thaumasiotes 7y ago
    > Progressive mode lets you ignore it before it's fully loaded. Huh? It's obviously easier to ignore the spinner than to ignore a low-res image. You've seen the spinner before.
    - mrob 7y ago
      Progressive mode doesn't need JavaScript.
- supportlocal4h 7y ago
  Progressive photos always irritate me. The photo comes on my screen all blurry and out of focus and I'm disappointed that the moment I thought I had captured didn't turn out. Then, 3 seconds later, the picture changes and gets slightly better. Then I'm hopeful, but disappointed again. Then i think, "maybe it's not loaded yet", so i wait and hope. Then 2 seconds later it changes again. Is it done? Is it loaded now? Will it get better? Is my computer just dog slow? How long should I wait before I assume it's as good as it's going to get? I know it's a small thing and doesn't really matter, but I don't like progressive photos. Edit: This is just one context. There are plenty of other contexts where progressive is very useful.
  - TheRealPomax 7y ago
    On the other hand, it also doesn't constantly change the DOM, moving you across the page because images above what you're reading are getting swapped in and now you're looking at the paragraph above the one you were reading. and again. oh, and again. and-
    - gardaani 7y ago
      Fixing jumping pages doesn't require progressive image formats. All browsers soon support setting default aspect ratio for all images: https://twitter.com/jensimmons/status/1220114427690856453 https://twitter.com/jensimmons/status/1220114427690856453
  - ksec 7y ago
    The progressive mode in Jpeg and JPEG XL is quite different, because the quality is so much better your perception of it changes. Where Progressive Jpeg are literally useless before it finish loading, JPEG XL provides decent quality.
    - supportlocal4h 7y ago
      I'm curious to see it. My irritation is really just when I actually care about the picture. When I'm specifically browsing my library, for instance. When it's the background for some webpage, or some other photo I'm not focused on, the progressive quality is probably a good thing.
- thaumasiotes 7y ago
  > By getting mostly usable content in as little time as possible to the user you decrease perceived wait See, this is the issue. Progressive images aren't "mostly usable content"; they're vague, ugly blobs.
  - spider-mario 7y ago
    It entirely depends on what progressive steps you define / where you stop loading.
ChrisLomont 7y ago
Systems that render low res can download the prefix of the file and show an image, and stop there. Many modern image formats support this for precisely this reason. If you then want higher quality for some particular image, you can download more, not having to start over with a separate image file.
TheRealPomax 7y ago
I'd by far rather see several full article-appropriately sized sideline image at only progression step 1 or 2 out of 5 or 6, than several empty boxes all showing spinners while the images load in. Plus I'd love the ability to say "I'm on a low bandwidth, $$$ per megabyte network, stop loading any image after the first iteration until I indicate I want to see the full one" because you almost never need full-progression-loaded images. They just make things pretty. Having rudimentary images is often good enough to get the experience of the full article. (whether that's news, or a tutorial, or even an educational resource. Load the text and images, and as someone who understands the text I'm reading, I can decide whether or not I need the rest of that image data after everything's already typeset and presentable, instead of having a DOM constantly reflow because it's loading in more and more images)
nathan_long 7y ago
Imagine this: you set your browser to download only the first N bytes of each image, showing you a decent preview. If you want more detail on a particular image, you tap it, and the browser requests the next N bytes (or the rest of the file, if you prefer). And to enable this, the site only needed to create one high-resolution image. Seems like a victory for loading speeds, for low-bandwidth, and for content creation. I think FLIF looks incredible.
- edflsafoiewq 7y ago
  Agreed, but is it likely? Does any browser implement the even simpler feature "Show a placeholder for images. Tap the placeholder to load the actual image"?