Lazyload Guide - Theme62

You can use Lazyload to delay loading of elements until they appear in the viewport, useful for increasing initial loading speed.

Lazyload can be applied to all elements, such as: Image, Iframe, JavaScript and others.

The implementation method is flanked by noscript

(a) Usage examples - Iframe

No Lazyload :

	<iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/AxyPASIXz1k" title="YouTube video player" width="560"></iframe>

With Lazyload :

	<noscript>
<iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/AxyPASIXz1k" title="YouTube video player" width="560"></iframe>
</noscript>

(b) Usage examples - Image

No Lazyload :

	<div class="separator" style="clear: both; text-align: center;"><a href="https://1.bp.blogspot.com/-P6Jx6INo0bo/YQoAa5-4-PI/AAAAAAAAYco/tn6ra2fKwswVjgI-ViCMTvcZq2cBdZh_QCLcBGAsYHQ/s613/docs.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="345" data-original-width="613" height="360" src="https://1.bp.blogspot.com/-P6Jx6INo0bo/YQoAa5-4-PI/AAAAAAAAYco/tn6ra2fKwswVjgI-ViCMTvcZq2cBdZh_QCLcBGAsYHQ/w640-h360/docs.png" width="640" /></a></div>

With Lazyload :

	<noscript>
<div class="separator" style="clear: both; text-align: center;"><a href="https://1.bp.blogspot.com/-P6Jx6INo0bo/YQoAa5-4-PI/AAAAAAAAYco/tn6ra2fKwswVjgI-ViCMTvcZq2cBdZh_QCLcBGAsYHQ/s613/docs.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="345" data-original-width="613" height="360" src="https://1.bp.blogspot.com/-P6Jx6INo0bo/YQoAa5-4-PI/AAAAAAAAYco/tn6ra2fKwswVjgI-ViCMTvcZq2cBdZh_QCLcBGAsYHQ/w640-h360/docs.png" width="640" /></a></div>
</noscript>

No Lazyload :

	<script>
var x = "Hello Blogger";
console.log(x);
</script>

With Lazyload :

	<noscript>
<script>
var x = "Hello Blogger";
console.log(x);
</script>
</noscript>