Nico

<p>Minimalistic lazyloading, loads images as they come into view. Adds native lazyloading to all images and embeds (Chrome) and adds a polyfill (1.07 KiB gzipped) to make it work in all browsers.</p>
<ul>
<li><a href="https://nextgenthemes.com/plugins/native-lazyload-polyfill/" rel="nofollow ugc">Homepage</a></li>
<li><a href="https://gitlab.com/nnico/native-lazyload-polyfill" rel="nofollow ugc">Gitlab</a></li>
</ul>
<h3>How it works technically (if you care)</h3>
<ul>
<li>Adds <code>loading="lazy"</code> to all <code><img></code> and <code><iframe></code> inside <code>the_content</code> and other areas.</li>
<li>Also wraps <code><img></code>, <code><iframe></code> and the content of <code><pictures></code> in <code><noscript></code>.</li>
<li>Adds the <a href="https://github.com/mfranzke/loading-attribute-polyfill" rel="nofollow ugc">loading-attribute-polyfill</a> to do its magic in JavaScript.</li>
</ul>
<p>Feedback/Help is very welcome.</p>


Native Lazyload + Polyfill

Adds native lazyloading to all images and embeds (Chrome) and adds a polyfill to make it work in all browsers.

Proloy Bhaduri

<p>This plugin will delay the loading of  background images in your website and thus helps boosting the website loading time by reducing total number of HTTP requests.</p>
<h3>Quick Notes & Links</h3>
<ol>
<li>Do not lazyload background images which are peresent above the fold because this will increase time to First Contentful Paint(FCP)  metric and affect the speed of your website . </li>
<li>Background images that are added using inline CSS e.g, <code><p style=" background-image: url( path/to/background-img.jpg )" > </p></code> are lazyloaded by this plugin by default . </li>
<li>No dependencies required  for this plugin  to work. </li>
<li>No extra HTTP request </li>
<li>Add the selectors of the elements that have background images in the plugin settings page  or add <code>lazyload-bg</code> class to the element .</li>
<li><a href="https://proloybhaduri.com/" title="WordPress Tips and Tricks by Proloy Bhaduri" rel="nofollow ugc">WordPress Tips and Tricks By Proloy Bhaduri</a></li>
<li><a href="https://www.buymeacoffee.com/proloybhaduri/" title="Support Proloy Bhaduri" rel="nofollow ugc">Buy me a Coffee</a></li>
</ol>
<h4>Works smoothly with almost every page builders</h4>
<h3>Exclude certain inline background images from lazy loading using filter hook <code>lazyload_inline_bg_excludes</code></h3>
<p>add_filter(‘lazyload_inline_bg_excludes’,function($exclude_keywords){<br />
    $exclude_keywords = [<br />
        ‘bg-image.jpg’,<br />
        ‘class-name’,<br />
        ‘id’,<br />
        ‘or any unique keyword that the element with background image has’<br />
    ];<br />
 },10,1);</p>
<p>Note: Add the above code to the <code>functions.php</code> file of your active theme/child theme or using a code snippets plugin.</p>


LazyLoad Background Images

Helps deferring offscreen background images and improves website speed by reducing HTTP requests .

Native Lazyload + Polyfill vs LazyLoad Background Images