Magento2 - How to implement slow loading

Question

I want to implement slow loading for my homepage.

My homepage consist of category image then 9 products related to that category.This continues for all categories. For that, I want to implement lazy loading. first by default one category and there products are displayed after that, rest category image and there products are displayed through lazy loading.

I want to know how can I implement lazy loading for this

Answer 1

You can use this free extension.
https://www.weltpixel.com/magento-2-lazy-load-product-extension.html

By default it will automatically be applied on category and product view page, to apply on custom pages or home page you need to perform below steps:

1. Add the html class lazy to the img element.
2. Add the html data-original attribute with the path to the image.
3. Add a loader image in src attribute which will be displayed before the image loads.

Example img tag:

<img class=“lazy” src=“path/to/loader-image/loading.gif” data-original=“path/to/image/image.jpg” alt=“” />