Hacker News Reader

Comment by bambax | Hacker News Reader

There are many browsers out there, not just Chrome and Firefox, esp. on mobile. Android Chrome is fairly out of sync with desktop Chrome. Kindle devices use their own browser and won't let you install another one, etc. Plus, mobile users update their apps or their OS rarely, if ever.

Shouldn't the solution come from the server side? You can serve different image sizes to different devices, whereas if you need the browser to do the work you'll wait forever.

There is even a simpler solution, which is to use just one image of average-to-small size, and size it in the page dynamically. If the image is of good quality in the first place (noise free), most users won't notice.

View on HN

The article mentioned the problem with this approach: Your browser loads the HTML, CSS, JS simultaneously with the images on the start of the page load - so when you find out what size you need at runtime (via JS), and then put in the right img-src, it will be slower than loading a higher-res version right from the start.

Another option would be to "guess" the right size to serve based on the User Agent String (maybe you meant this and I misunderstood?). This could work, although the server may very well guess wrong.

Yes, I meant "guessing" the right size based on the user-agent string as the best approach (since it doesn't rely on the browser doing the work, it will work with any browser, including old ones).

But I also maintain that a single image of relatively small size can be used for all form factors if its quality is good enough (resized by the browser based on CSS instructions); you can at least double the size of a "good" image before you begin to see problems.

The user-agent is the biggest cluster fuck in the history of the web and has nothing to do with HTML. Once you understand this, you'll learn to ignore it.

Noise has nothing to do with good quality in this case. Pixels are the enemy, and they show up all too quickly when you scale a small image to a large size.

And conversely, you don't want to load a huge high-res image on mobile devices with bad connections that won't even use them.

Reply on news.ycombinator.com