Lazy Load Images, Iframes and Videos

Updated on:

I have performed some tests and reached the conclusion that we should lazy load images, iframes and videos.

I thought I was supposed to leave that job to WordPress but I found out that I was wrong.

There are several plugins that can help you do that such as PerfMatters, WP Rocket and FlyingPress

Since I like to keep plugins to do exactly what I need, I was trying to find a very light plugin to optimize images and videos.

The main problem are YouTube videos since they load a few scripts and resources even when the video hasn’t been clicked on.

After playing with several plugins, this is the one that won the battle

LazyLoad Plugin by WP- Rocket

I chose LazyLoad Plugin – Lazy Load Images, Videos, and Iframes over the other options because the plugin does what you want without any complication.

This plugin by WP Rocket adds some unminified code to your pages and loads one script which is 3.23 KB in size.

The plugin also replaces Youtube iframes with a preview thumbnail.

I installed the plugin in all my sites and forget about it

Optimize More! – Images

I kept reading about optimization and code snippets and I ended up reading an article from the thinkweb.dev website.

While I was checking the rest of the articles, I realized that they have a plugin to optimize images.

Optimize More! – Images uses Lozad.js which is lighter than the library used by WP Rocket

I gave the plugin a try and it delivers on its promises.

The script loads only 1.68KB so I fell in love with it so it became my go to plugin when it comes down to lazy loading for a while.

mind-blowing-chance-the-rapper

I ran some tests since this plugin doesn’t have the option to replace the YouTube Iframe with a preview thumbnail but the videos get lazy loaded and don’t make any external requests.

The plugin has less than a hundred installations so I hope it gets the credit it deserves soon.

Native Lazy Loading

The quests for having a fast site didn’t end with Optimize More! – Images

I installed Native Lazyload a plugin created by Google which has 10,000+ installations.

I ran some tests and the images and videos get lazy loaded and no external requests are made

The plugin only adds a script as a fallback when the user’s browser does not support the native loading attribute yet.

Run your own Tests

There are other plugins for lazy loading images, iframes and videos but they need more than one script or they have way too many options.

I wanna keep things as lightweight as possible. The fewer scripts my sites needs, the better.

Test and test some more. I can’t tell you what works for you. All sites are different.

More about Speed

These are some posts where I gather my thoughts about speed optimization tips

  1. How to Add Custom CSS to Your WordPress Site
  2. Optimize the Block Library StyleSheet
  3. Are CloudFlare APO and Full Page Caching the same?
  4. WP Rocket: Love it and Leave it
  5. Perfmatters: Love it or Leave it
  6. How to Optimize GeneratePress for Core Web Vitals [100% Solved]
  7. How to Lazy Load Ads
JM

Sobre Jose Manuel

I am José Manuel. I am writing about things I know and things that I am learning about WordPress. I hope you find this blog useful.