Lazy Loading – Don’t load images unless needed

A faster website, save bandwidth, by loading images as needed.


Lazy Loading is a process of loading imaged only IF and as needed. Without Lazy Loading, there are three downsides.

  1. Each webpage will load fully even if not needed, maximizing needlessly bandwith usage.
  2. This is especially rough on slow connections, and a very important consideration on mobile. Data is usually limited on mobile phones, and loading only as needed can help save a tremendous amount.
  3. BLANK pages while waiting. It can be possible that while waiting for a webpage to finish downloading all the images, the webpage doesn’t display/load for the end user. Again, this is the most important for slow or cellular connections.

A primary benefit of lazy loading is that the page appears to load almost instantly. And if more images are needed, they will load as you scroll down.

I’ve created THIS page as an example, with 24 medium sized images. As you start to scroll down this page (do it slowly), you will see each image. Do this for a few images, then scroll immediately to the bottom of the page. You will see that the images haven’t quite loaded yet, but they will.

So, go ahead and test. When you are finished, continue reading.

Lazy Loading is a plugin I use for all my website builds. It costs nothing, has amazing upsides, and as of yet, I’ve not discovered any downsides.





Baby Giraffe


Bald Eagle






Black Bears


Brown Bear




Fennec Fox


Gray Wolf








North American River Otter





Pygmy Hippo


Reindeer Fawn


Sea Lion


Tasmanian Devil











Leave a Comment