Shameless self promotion: Did a video recently that explores how various image formats look as they load https://youtu.be/-7k3H2GxE5E.
Includes adam7 PNG (used here), but covers other browser image formats + JPEG-XL.
Includes adam7 PNG (used here), but covers other browser image formats + JPEG-XL.
Also, I just skimmed through it: it contains many examples throughout, and given that what's being shown is how an image changes over time as it loads, a video is not an inappropriate format I'd say.
The part where the two of you discuss how Firefox and Chrome now load progressive JPGs with blur instead of keeping it pixelated made me wonder: what happens if I set the CSS of an image to upscale it with pixelation? Does it also force progressive JPGs to stay pixelated while loading?