Lazy Load Plugins For WordPress

You are using a caching plugin, and your website is still too slow? If you have a lot of pictures on your side, that could be a big speed brake. In many cases, Lazy Load plugins for WordPress, which load the images later, help here. I would like to introduce some of them to you in this post.

What does lazy Load actually mean?

With lazy load technology, certain content on a website, such as images or videos, is only loaded when required. For example, an image is only loaded when it is really needed.

And when is it needed? Of course, only when it is in or just before the user’s visible area. If the user does not scroll to the bottom of the page, the images at the bottom of the page are not even loaded.

This avoids unnecessary inquiries and improves the website’s performance despite the large number of images because a script replaces these with a placeholder. Only when the user scrolls into the area of ​​the image is the placeholder replaced with the actual image.

How does this affect the loading time?

For my test, I evaluated an article with and without a plugin using the Pingdom performance tool.

You can clearly see what the lazy loading technique does:

  • The page size has shrunk from 1.6 MB to 283 KB.
  • The number of inquiries has decreased from 45 to 15.

Of course, this also affects the loading time. This has dropped from 821ms to 406ms. This makes the site twice as fast!

Are there any disadvantages?

The only potential downside to lazy loading is the user experience. If you choose the delay value (threshold) incorrectly, the user will have to wait too long for the image to load.

As a rule, the threshold value for most plugins is 200. This means that the image is already loaded when it is 200px in front of the user’s visible area. The larger the value, the earlier the image will be loaded. A value lower than 200 is perceived as annoying by most surfers.

Lazy load plugins

There are many lazy load plugins for WordPress. Of course, all of them can load pictures with a delay; some also offer other functions—Eg lazyLoad for videos and iframes or special optical features.

I have already used or tested all of the plugins listed here myself.

Even if you use lazy loading, you should still optimize and compress your images.

a3 lazyLoad

I have used the plugin a3 Lazy Load myself very often and with good results. The special thing about this tool are the many features and setting options. It offers Lazy Load not only for images but also for videos, iframes, and Gravatars. You can even delay loading the images in widgets.

If you want to exclude certain pages or image classes from delayed loading, you can easily set this because the plugin offers you a clear admin interface.

LazyLoad by WP Rocket

With LazyLoad from WP Rocket, you can only load pictures and videos when they are needed. A big advantage is that the plugin does not require a JavaScript library like jQuery and is very small at 10 KB.

The setting options are very limited compared to a3Lazy Load. Or. you have no menu item to set the options you want.

If you want to load certain images normally, you can only set this up manually. The same applies to the value from which the images should be preloaded. To do this, you have to include the following function in the functions.php of your child theme :

function rocket_lazyload_custom_threshold( $threshold ) {

    return 100;

}

add_filter( ‘rocket_lazyload_threshold’, ‘rocket_lazyload_custom_threshold’ );

On my side, this tool delivered the best values. I now use WP Rocket’s caching tool , which already includes the lazy load function.

Lazy loader

With Lazy Loader, you can load your pictures, videos, and iframes with a delay. Unfortunately, LazyLoading of images in the widget area often didn’t work for me, but it works very well with Masonry layouts.

BJ Lazy Load

The BJ Lazy Load plugin has been around for many years, and I’ve tested it every now and then. However, the other plugins on my pages always delivered better results.

BJ offers a lot of functions: delayed loading of images, iframes, and Gravatars. You can also define the image placeholder, threshold, and exceptions yourself.

A special feature is the use of a low-res preview image. This means that you will be shown a low-resolution version of the image before the actual image is loaded.

Dominant Colors Lazy Loading

With Dominant Colors Lazy Loading, you can only load the images on your site with a delay. But the tool offers a special design feature.

Inspired by Pinterest, the plugin creates a placeholder image in the main colors of the actual image. It definitely looks stylish and makes your site a little faster at the same time.

Zedna WP Image Lazy Load

One of the few plugins that also supports background images is Zedna WP Image Lazy Load. Of course, you can also use it to lazyLoad all other pictures, videos, and iframes. However, the speed results are not that good compared to the previous plugins.

But the Zedna offers a few nice effects for fading in the images.

Lazy loading in WordPress version 5.5

The new WordPress 5.5 version already contains Lazy Load for images as standard. If this feature is enough for you, you can do it without additional plugins.

Conclusion:

If you have a lot of pictures on your website, you should definitely test a lazy load plugin. Unfortunately, I cannot say in general, which of the plugins is the best for you. Because that often depends on the theme and layout used.

Do you already use a caching plugin for WordPress? Then you can check here in the settings whether the function for lazy loading is included. Because some plugins such as WP Rocket or Swift Performance already bring this technology with them. This saves you another plugin.