Lazy Loading for Magento 2


Magento 2 Lazy Loading extension allows speeding up the site load by showing the image only at the demanding time. Lazy Loading improves site performance and reduces bounce rate due to slow loading.


60-day Money Back

Frequent Update

365-day Support

Live Demo


You've just added this product to the cart:

Lazy Loading

Lazy Loading for Magento 2

You've just added this product to the cart:

Lazy Loading Pro

Lazy Loading for Magento 2

From February 1, 2022, we are launching Product Subscriptions
Buy now to get 15% cashback and other appealing incentives.
Learn more →


What is Lazy Loading and its benefits?

Lazy Load image means that the images aren’t loaded until the user scrolls and images come into the browser’s viewport.
The process of Lazy Loading typically likes that:

  • You visit a page and scroll through the content
  • Instead of the actual image, you see a blurry placeholder image
  • Instantly after that, the actual image replaced the placeholder.

With Magento 2 Lazy Loading, the page loading time is reduced significantly. The page is not hard to load the whole images from top to toe at once. Instead, the images can be loaded only when they are scrolled, reaching customers’ viewport.

The page weight is lightened and speeds up the loading of the webpage.

Lazy Loading conserves bandwidth by delivering images to users “on-demand” when they come into customers’ viewport.

Lazy Loading conserves both server and client resources, because, for some images, JavaScript and other code actually need to be rendered or executed.

Because the page loading is sped up significantly, besides animated image transactions, customers will have a better experience during their time surfing and shopping.

According to Hubspot, 47% of users expect a webpage to load less than 2 seconds and a 1-second delay in page load causes 11% decrease in page viewers.

Therefore, improve page loading by Lazy Loading supports stores to keep customers on site, which reduces the bounce rate effectively.

Lazy Load Images

Delay images until reaching the user’s viewport With Lazy Loading, only images within the viewable part of the page will load. Images out of view will not load unless the user scrolls down the page and they come into view.

Improve page loading Magento 2 Lazy Loading extension is really useful to the long web pages. Because it does not take time to load totally all images at once, the page load is sped up significantly. Hence, it decreases the bounce rate coming from slow page loading.

Easy to apply Lazy Loading to the most popular pages on any store site. Here are the pages/sections that are always visited:

  • Category Page
  • Product Page
  • CMS Page
  • Search Page
  • Related, cross-sell, up-sell blocks

The kind of pages always contains the most product images. Therefore, it is very useful to apply the Lazy Loading to them.

Various Lazy Loading effects

Lazy Loading module offers diverse loading effects for the store admin to apply easily and suitably.


  • Transparent: This is the most recommended one to improve Lighthouse results.
  • Blur: Smooth loading transaction
  • Low resolution: Blurred or pixelated loading

Loading icon Use any loading icon when loading images. Upload any icon (gif, jpg, svg, png) as you wish.

Set loading point time

Lazy Loading

By default, images are loaded immediately when they appear on the screen. However, if you want the images to load earlier, you can use the threshold parameter.

For example, if the threshold is 200px, the image load appears within 200px far from the viewport (invisible loading).

This maintains the constancy of image appearance while it saves bandwidth.

Exclude Lazy Loading with ease

In case you do not want to apply Lazy Loading to all images, there are multiple ways to add exclusions.

  • Exclude page with URL: Page(s) with the exclude URL(s) will not be applied with Lazy Loading. For example: /gear.html
  • Exclude CSS class: Images with exclude CSS class will not be applied with Lazy Loadinging. For example: <img class="downloadable-product" src="lifelong.jpg">
  • Exclude Text: Image title or image name with the exclude text will not be applied with Lazy Loading. For example: <img title="lifelong" src="download.jpg">
Lazy Loading

AVADA Marketing Automation by Mageplaza (recommended)

magento 2 avada email marketing

All-in-one platform for email marketing that allows you to:

  • Follow up and convert customers by Automation Campaigns: Welcome series, Abandoned Cart emails, Order follow up, Cross-sell, Upsell emails
  • Promote your brand and quickly drive sales by sending mass Newsletter Emails
  • Send your messages to the right people and increase conversions with Advanced Segmentation
  • Collect leads and deliver promotions with stunning Signup Forms, and Spin to Win

Full Features List

For store admins

  • Enable/ Disable the Lazy Loading extension
  • Select pages to apply Lazy Loading: Category Page, Product Detail Page, CMS Page, Checkout Page, Search Page, Related/Cross-sell/ Up-sell product block.
  • Exclude Lazy Loading application by exclude URL, exclude CSS class, Exclude text in image title/ name
  • Set the loading threshold
  • Select the loading type: icon or placeholder
  • Upload loading icon and able to resize
  • Select the placeholder type: Transparent, Blurred, Low resolution
  • Compatible with orther extensions: Product Options, Image Optimizer, Configurable Product Grid View, Free SEO Module,etc...

For customers

  • Experience the fast-loading page
  • Time-saving and have better user experience


You can apply Lazy Loading to images on Category Page, Product Detail Page, CMS Page, Checkout Page, Search Page, or Related/Cross-sell/ Up-sell product blocks.

There are two main types: loading icon and lightweight placeholders. With the loading icon, you can upload any image to make the loading icon (recommended size 64x64). With placeholder, you can select 3 types: transparent, blurred or low-resolution.

Threshold is used in case you want the images to load earlier, you can use the threshold parameter (px). For example, if the threshold is 200px, the image load appears within 200px far from the viewport.


Can't find your feature?

Are you looking for a feature in Lazy Loading. Tell Elle your wants and needs.

Chat with Elle

Are you an agency?

Do you often visit us for purchasing extensions and technical support? Speak to April to learn about your exclusive benefits on Mageplaza

Chat with April


25 May 2021

Good extension but doesn't with product ajax pagination

Image does not load with ajax pagination

Raj -Verified Purchase
04 February 2021


I had a great experience using this extension. I can set this feature on different pages and there are lots of loading effects to choose from so it is very flexible. Mageplaza rocks!

Ricky -Verified Purchase
02 February 2021

Free but good

Can't believe this is free. It's so good and easy to install. The loading time reduced but the site was still engaging. Highly recommended. This is free so why don't you give it a chance?

Keith Lambert -Verified Purchase
24 February 2020

Best service ever

Prime was extremely helpful and resolved the issue very quickly. Very much appreciated. It gives me great confidence in using Mageplaza products. Thanks.

Andy -Verified Purchase

Leave a Review

How do you rate this product?

Your email address on Mageplaza's store

Plain text, no HTML tags.