Published at
Updated at
Reading time
This post is part of my Today I learned series in which I share all my web development learnings.

It's speedy TIL time! Did you know the loading="lazy" attribute doesn't work when you turn off JavaScript?

Now, you do. ๐Ÿ˜‰

Why doesn't lazy load work without JS? There's only one reason why we can't have nice things: of course, it's for tracking prevention.

Here's the loading MDN documentation explaining the behavior:

Loading is only deferred when JavaScript is enabled. This is an anti-tracking measure, because if a user agent supported lazy loading when scripting is disabled, it would still be possible for a site to track a user's approximate scroll position throughout a session, by strategically placing images in a page's markup such that a server can track how many images are requested and when.

And if you really want to get into this topic, here's the related spec describing when loading="lazy" should work.

And just to be clear, because some folks were confused: images will still load when JS is disabled. It's only the deferred loading that won't work.

Was this TIL post helpful?
Yes? Cool! You might want to check out Web Weekly for more quick learnings. The last edition went out 4 days ago.
Stefan standing in the park in front of a green background

About Stefan Judis

Frontend nerd with over ten years of experience, freelance dev, "Today I Learned" blogger, conference speaker, and Open Source maintainer.

Related Topics

Related Articles