In spite of an increase in Internet speed, webpage speeds have not improved

Re:In spite of an increase in Internet speed, webpage speeds... by Wowfunhappy on Tuesday August 04, 2020 @04:42PM (#24054281)

Can someone who understands more about web tech than me please explain why images aren't loaded in progressive order? Assets should be downloaded in the order they appear on the page, so that an image at the bottom of the page never causes an image at the top to load more slowly. I assume there's a reason.

I understand the desire to parallelize resources, but if my download speed is maxed out, it's clear what should get priority. I'm also aware that lazy loading exists, but as a user I find this causes content to load too late. I do want the page to preload content, I just wish stuff in my viewport got priority.

At minimum, it seems to me there ought to be a way for developers to specify loading order.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by dgb23 on Tuesday August 04, 2020 @04:54PM (#24054393)

That is actually the case today!

But it is an opt-in feature, which is not supported in older browsers.

In modern frontend development we are heavily optimizing images now. Lazy loading is one thing, the other is optimizing sizes (based on viewports) and optimizing formats (if possible).

This often means you generate (and cache) images on the fly or at build-time, including resizing, cropping, compressing and so on.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by hnick on Tuesday August 04, 2020 @08:24PM (#24055956)

Is progressive image loading still a common thing? I'd guess for a lot of connections it actually hurts more than it helps - until you get to that fat image-heavy site.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by Bnshsysjab on Tuesday August 04, 2020 @05:41PM (#24054785)

Is putting all assets into a single png/svg to reduce total requests a dead practice now?

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by tbarbugli on Tuesday August 04, 2020 @06:00PM (#24054948)

I guess http/2 support on CDN made this a useless (and tedious) optimization

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by Polylactic_acid on Tuesday August 04, 2020 @07:29PM (#24055615)

There was also the issue on an ancient version of IE that it could only load a few requests at the same time.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by reaperducer on Tuesday August 04, 2020 @06:39PM (#24055274)

Is putting all assets into a single png/svg to reduce total requests a dead practice now?

As someone who browses the source of a lot of commercial web sites, I can say it's still dead common.

There's been a lot of static about new technologies coming that will make this unnecessary, but that don't help anyone today.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by gcpwnd on Tuesday August 04, 2020 @08:45PM (#24056072)

Should be done only if you have to load lots of small images. If you want to render above the fold fast reduceassets there and load them directly.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by j-krieger on Tuesday August 04, 2020 @06:54PM (#24055376)

It is not supported by Safari, too.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by yoz-y on Tuesday August 04, 2020 @04:54PM (#24054397)

I suppose simple order in the HTML document would be a heuristic that works almost always, but due to CSS the order is actually not guaranteed. You need to download images before doing the layout first too as you don’t know the sizes beforehand.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by Wowfunhappy on Tuesday August 04, 2020 @06:14PM (#24055059)

It's not just CSS screwing up the order! On my own (simple) sites, I can see all the images I put on a page getting downloaded in parallel—with the end result being that pages with more images at the bottom load more slowly even above the fold.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by Something1234 on Tuesday August 04, 2020 @05:54PM (#24054898)

That's what the width and height attributes on the img tag are for. They're hints. Things can be redrawn later. Although I think I've been seeing a lot fewer images on the internet lately, but they must be hidden with css.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by yoz-y on Wednesday August 05, 2020 @05:13AM (#24058731)

I know. And I wish my static site generator of choice (Hugo) added the tags automatically to the HTML.

Would it be possible to download just the headers of images first to get the metadata?

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by Something1234 on Thursday August 06, 2020 @10:01AM (#24070935)

It's still a decent amount of overhead to even make the request for those bytes.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by cellar_door on Tuesday August 04, 2020 @05:43PM (#24054796)

You can code split React components and create loading tiers.

Facebook claims they're doing this with the facebook.com redesign, for example: https://engineering.fb.com/web/facebook-redesign/

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by sarego on Tuesday August 04, 2020 @04:52PM (#24054376)

Understandable but for most use-cases (if your images are hosted on a reliable CDN and are optimized) lazy load should work fine. Lazy load works based on the distance of the image from the viewport so it may not load too late.

Chromium based browsers now natively support lazy-loading.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by hajile on Wednesday August 05, 2020 @10:14AM (#24060972)

Order in HTML doesn't necessarily correlate to what a person can actually see (it's also possible to load images using CSS or even JS).

You could wait for layout and then load, but that would incur another big penalty (especially on JS-rendered pages).

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by kmlx on Tuesday August 04, 2020 @04:54PM (#24054395)

yes, there is already

simply add the property to your html images and the browser will automatically load them when in the viewport (i.e. just the ones you actually see)

further details: https://caniuse.com/#feat=loading-lazy-attr

https://html.spec.whatwg.org/multipage/urls-and-fetching.htm...

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by Wowfunhappy on Tuesday August 04, 2020 @05:04PM (#24054482)

But then they always seem to not come in until I scroll to them, which is too late and just means I have to wait even more! What they ought to do is download as soon as the network is quiet.

[ Parent | on HN ]

Re:In spite of an increase in Internet speed, webpage speeds... by xenospn on Tuesday August 04, 2020 @04:51PM (#24054372)

This is what lazy loading does. It doesn’t actually load images that are “below the fold”. Or at least that’s what it should do. Images should only load once your start scrolling down.

[ Parent | on HN ]