Web images performance

Web images performance

This goal contains tips and tricks that will help you to understand how to pick the correct web images format, which type of compression needs to use to reduce side and keep quality, how to serve the responsive images, and hove to lazy load them.

Steps

Choose the correct level of compression

Defer offscreen images

Replace animated GIFs with video for faster page loads

Serve images with correct dimensions

Use lazy-loading to improve loading speed

Use lazysizes to lazy-load images

Use image CDNs to optimize images

https://web.dev/image-cdns/