Images are essential for every website and application today. Whether it be marketing banners, product images or logos, it is impossible to imagine a website without images. Sadly though, images are large in size making them the single largest contributor to the page size. Now, since we cannot do away with images, we need to make our web pages load fast with them. So We can implement Lazy Loading.
Lazy Loading Images is a set of techniques in web and application development that defer the loading of images on a page to a later point in time - when those images are actually needed, instead of loading them up front. These techniques help in improving performance, better utilization of the device’s resources, and reducing associated costs.
We have many plugins and techniques for lazy loading, so among them, we can use lozad JS for lazy loading. This one is my favorite and easy to use. We can use this plugin for image tag and CSS background image also. You can check the Demo
Note: Ignore all the images which are placed on default view port or first fold for lazy loading.
Add Following JavaScript to make Lazy load works in OLD IE Browser