For image-intensive pages, lazy loading offers a great tool to help get page weights down.
How lazy load works
The first image will load normally. Any other images will load as they are scrolled in to view.
To use lazy loading with your images, you'll start by using the following markup:
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-lazy data-orginal="/path/to/your/image" width="800" height="450">
Images marked up in this way will only load as we need them.