Lazy Loading

Offscreen images are loaded lazily (A noscript fallback is always provided).

It will improve the response time of the current page and then avoid loading unnecessary images that the user may not need.

• Use Lighthouse to identify how many images are offscreen.

• Use a JavaScript plugin like the following to lazyload your images. Make sure you target offscreen images only.

• Also make sure to lazyload alternative images shown at mouseover or upon other user actions.

• verlok/lazyload: GitHub

• aFarkas/lazysizes: GitHub

• mfranzke/loading-attribute-polyfill: GitHub

• Lazy Loading Images and Video | Web Fundamentals | Google Developers

• 5 Brilliant Ways to Lazy Load Images For Faster Page Loads - Dynamic Drive Blog