Ah yes. Lazy images. Magical content that only loads when you need it. I learned to code with Haskell, so I'm partial to laziness.

Also, my job depends on it. I work with a bunch of talented designers who make graphic-heavy websites. Tens of MB per page, even after JPG optimization! Besides making smaller images and using srcsets, we use lazy loading. It's so useful, I'm surprised that it never found its way into a standard until recently.

The first piece of the puzzle is detecting when the img elements come onscreen. It's not as simple as a listener or callback. We have some hard requirements: