The browser is definitely in a better position to handle downloading these images on a slow connection without blocking the rest of the page from loading. Unfortunately, it doesn't, at least without extensions that only a very small percentage of users are aware exist. I have long wished for browsers to use more discretion when on slow connections, or failing that, to at least inform websites that they are on a slow connection so that I can optimize my sites for slow connections without sacrificing the experience for fast ones. Alas, this is not the world we live in.
Please explain to me what benefit the fade-in has to
a) low-bandwidth users
b) high-bandwidth users
?
Edit: answering myself.
There are least four aspects to the delayed display of images that I can imagine.
1) delay from loading time to when the download is triggered
2) delay and annoyance caused by the time fade-in itself takes
3) delay caused by not progressively painting the image while it is being downloaded
4) perhaps most important to modern designers: avoiding slowing down the mobile browser by avoiding decoding images that the user has already scrolled past.
I think #4 is why desktop users with 10x faster CPUs and connections suffer.
I do think this is the wrong way to go about solving problems like this.
The fade-in, as I understand it, waits until the page has loaded to actually start downloading the image. This means that the image download will not be competing for connections and bandwidth with HTML/CSS/JS files that are required for first paint.
Whether this makes a significant difference is probably highly dependent on the page and the user's connection, and I have no idea without profiling. But it's at least plausible that it would help some users on slow connections.
Of course, it could just be that devs are A/B testing time until the "load" event fires, in which case they've just found a way to cheat the metric.
