4 ms·

I disagree. If you have a user on a very slow connection on an image heavy site, the user experience will be enhanced significantly. Depending on how you implem

I disagree. If you have a user on a very slow connection on an image heavy site, the user experience will be enhanced significantly. Depending on how you implement it, you might even save them bandwidth. No interesting content for them in the current viewport and they scroll past the placeholders/go to the next page? Cancel the XHR requests you made for the full-size thumbnails/images and start anew.

ino 9y ago
Downside: if it's an image that for some reason doesn't load, the user is confused because it doesn't match the caption. I've had this happen with blurred images on some websites.
rocky1138 9y ago
I agree with GP. Personally, I hate websites that show a blurry version of an image before the final one loads. It plays with my eyes. I have to look away and peek to see if it's done before I can read on. I wish there was a way to disable this functionality.
- AnkhMorporkian 9y ago
  I didn't mean to refer to blurred images, but the unblurred outline SVGs in this article. I think the blurred ones are somewhat pointless too. The unblurred versions give you actual information as to what the image is. For instance, the sneakers image; if I didn't care about sneakers, I'd be likely to just scroll past it. In the blurred version, I might not be able to tell that they're sneakers.
  - deleted 9y ago
    [deleted]
  - jmmcd 9y ago
    Interesting: I didn't see any images of sneakers. I saw the Golden Gate bridge, and a vague shot of a woman. Are they serving a different set of images (and example js) to different readers?
    - AnkhMorporkian 9y ago
      It was in the GIF of the Gatsby 3 implementation in the embedded tweet. Here's a direct link to the tweet to save you some time: https://twitter.com/nystudio107/status/920673966091534338?ref_src=twsrc%5Etfw&ref_url=https%3A%2F%2Fmedium.freecodecamp.org%2Fmedia%2F1773750892f5339bc189f993979325e4%3FpostId%3Dbed1b810ab2c https://twitter.com/nystudio107/status/920673966091534338?re... Edit: Maybe they're not sneakers, but they're shoes. I just wear loafers, I really have no idea what any shoe types are called.
- chrismorgan 9y ago
  Ditto. It’s even worse when combined with lazy scroll-based loading: now you’re guaranteeing that I’ll see the unpleasant version briefly (especially in Australia, I imagine, where there’s generally higher latency on such requests than in the USA—but I haven’t tried Medium or similar sites from the USA, so I’m not sure if it’s as unpleasant there). It’s worst of all when combined with lazy scroll-based loading and an unreliable internet connection: I load pages in places where I know I have an internet connection, and then read them in places where an internet connection is unavailable. With lazy loading of these things, I can no longer be confident that it’s actually loaded everything I need. Same deal with Medium’s blocked iframes for things like CodePen—that just means that the iframe is not loaded when I need it to be. I want less magic, not more, because we’ve proven as an industry that we’re not responsible with magic, and always manage to make a mess with it.
lewisl9029 9y ago
Yep, the main use case I imagine for something like this would be to show a blurred/tastefully-rendered <10 KB SVG _instead_ of a multi-megabyte hero JPG that still ends up looking horrible on 4K screens.

ino 9y ago

Downside: if it's an image that for some reason doesn't load, the user is confused because it doesn't match the caption. I've had this happen with blurred images on some websites.

rocky1138 9y ago

I agree with GP. Personally, I hate websites that show a blurry version of an image before the final one loads. It plays with my eyes. I have to look away and peek to see if it's done before I can read on. I wish there was a way to disable this functionality.

AnkhMorporkian 9y ago
I didn't mean to refer to blurred images, but the unblurred outline SVGs in this article. I think the blurred ones are somewhat pointless too. The unblurred versions give you actual information as to what the image is. For instance, the sneakers image; if I didn't care about sneakers, I'd be likely to just scroll past it. In the blurred version, I might not be able to tell that they're sneakers.
- deleted 9y ago
  [deleted]
- jmmcd 9y ago
  Interesting: I didn't see any images of sneakers. I saw the Golden Gate bridge, and a vague shot of a woman. Are they serving a different set of images (and example js) to different readers?
  - AnkhMorporkian 9y ago
    It was in the GIF of the Gatsby 3 implementation in the embedded tweet. Here's a direct link to the tweet to save you some time: https://twitter.com/nystudio107/status/920673966091534338?ref_src=twsrc%5Etfw&ref_url=https%3A%2F%2Fmedium.freecodecamp.org%2Fmedia%2F1773750892f5339bc189f993979325e4%3FpostId%3Dbed1b810ab2c https://twitter.com/nystudio107/status/920673966091534338?re... Edit: Maybe they're not sneakers, but they're shoes. I just wear loafers, I really have no idea what any shoe types are called.
chrismorgan 9y ago
Ditto. It’s even worse when combined with lazy scroll-based loading: now you’re guaranteeing that I’ll see the unpleasant version briefly (especially in Australia, I imagine, where there’s generally higher latency on such requests than in the USA—but I haven’t tried Medium or similar sites from the USA, so I’m not sure if it’s as unpleasant there). It’s worst of all when combined with lazy scroll-based loading and an unreliable internet connection: I load pages in places where I know I have an internet connection, and then read them in places where an internet connection is unavailable. With lazy loading of these things, I can no longer be confident that it’s actually loaded everything I need. Same deal with Medium’s blocked iframes for things like CodePen—that just means that the iframe is not loaded when I need it to be. I want less magic, not more, because we’ve proven as an industry that we’re not responsible with magic, and always manage to make a mess with it.

lewisl9029 9y ago

Yep, the main use case I imagine for something like this would be to show a blurred/tastefully-rendered <10 KB SVG _instead_ of a multi-megabyte hero JPG that still ends up looking horrible on 4K screens.