Lazy Loading Images from CSS Instead

It is good for Web Developers to know how the DOM functions and the benefit of knowing Lazy Loading techniques. When the DOM receives the response from the Server, it then constitutes the DOM tree by reading HTML and CSS and finding the external resources to request. At this time, if you define images/background images in CSS to be loaded lazily, the performance can be optimized. Define a class on an image tag with class="lazy-background" then in css file do; .lazy-background.visible {background-image: url(blah blah)}. 

Remember to include a placeholder that would go inside an image tag when not visible  

Edit this Article
Was this page helpful?
Yes Yes! this solution to the problem was helpful. No No! this solution to the problem was not helpful.. Leave ErnesTech Feedback.Feedback
If you log in, you will be notified when someone leaves a comment.

Other users would like to know if this solution helped you.

Your Session is Ending
Login to Continue

© 2021 - ErnesTech - Privacy