DEV Community

Ben Halpern
Ben Halpern

Posted on • Updated on

If you enable "lazy loading" in chrome://flags, your DEV browsing experience will be moderately more efficient 😄

Update: Lazy loading shipped in Chrome recently

I just merged this PR, which adds loading="lazy" to a bunch of images around dev.to.

Add loading='lazy' attribute to some images #2776

What type of PR is this? (check all applicable)

  • [ ] Refactor
  • [x] Feature
  • [ ] Bug Fix
  • [ ] Documentation Update

Description

This will get get us ready to benefit from the loading="lazy" feature when it ships in Chrome. Shouldn't cause any problems to have it live now. This will mean on pages like lists the user won't get images loaded that are way below the fold.

I figure getting this in early will only help our SEO as I'd guess Google will be looking to reward this attribute when it ships.

https://dev.to/ben/native-lazy-loading-for-img-and-iframe-is-coming-to-the-web-55on

You can turn it on now with chrome://flags

TODO: Implement on more images and iframes.

This functionality is expected to ship with Chrome 75 in early June, but this flag will let you play with it right now.

Will this have a major affect on anything in your life? No. You probably won't notice anything. But some images will defer loading until you are close to needing them—which is nice.

This was an easy change and we'll now be guaranteed to have the functionality ready the first day it ships generally.

Happy coding!

Top comments (11)

Collapse
 
turnerj profile image
James Turner

Would love to know if you notice a measurable difference in bandwidth since adding the change.

Collapse
 
ben profile image
Ben Halpern

We'll make sure to track the difference to the extent we can. It will be a while until a substantial amount of people are actually being impacted by this.

We're probably serving a solid 3-4 TB of images/month these days and it's not getting any cheaper!

Collapse
 
turnerj profile image
James Turner

We're probably serving a solid 3-4 TB of images/month these days...

Wow, I figured you would serve a lot but that is greater than I imagined! Would love an article going into the "issues at scale" that the site faces as it grows, things like how maybe a year ago bandwidth was X with Y users compared to now. Or even like how code you thought would be fine is needing to be improved because of the scale of traffic etc.

Thread Thread
 
ben profile image
Ben Halpern

Will do! We are lucky in this regard to have made some choices for scale early on because I was so hell-bent on performance. And perf and scaleability are highly correlated.

But scale absolutely makes changing things more of an orchestration. We can’t just flush the cache after a design change so easily. And it can be hard to account for how a new thing will work under load.

However, our scale is still pretty much chump change compared to some scale... so we’ll see about real scale in maybe a year.

But yeah, I can still write that post. 😄

Collapse
 
jsrn profile image
James

Awesome! Does anyone know if/when browsers other than Chrome are going to follow suit?

Collapse
 
ben profile image
Ben Halpern

I'm not sure. But since this is a pretty quiet change, I'm not too concerned about it.

Unlike Portals, which would radically affect which browsers can do what.

Some comments may only be visible to logged-in visitors. Sign in to view all comments.