Optimizing images can offer some of the biggest size savings and performance improvements to your website. The fewer image bytes a browser has to fetch, the less competition there is for a user’s bandwidth and the quicker a browser can download and display content on the display.
This book focuses on practical tools and techniques for automating image optimization as much as possible.
What you'll learn:
- Explore why image optimization is important
- Dive into JPEGs, PNGs, WebP, SVG, lossy and lossless compression
- Learn tips and tricks for what tools to use for automating your image optimization easily
- Discover how modern JPEG encoders like MozJPEG and Guetzli can shrink your images even more
- Understand techniques for intelligently loading images as they are needed, like lazy-loading
- Examine how browsers process images and how this can be expensive on mobile
- Understand the pros and cons of self-optimization vs using a third-party CDN
When considering image optimization, remember that the fastest request is the one that doesn’t need to be made. Ask yourself whether an image is required to deliver a good user experience. Images you can eliminate will always be the best optimization strategy. If an image is needed, there are many techniques covered in this book that can reduce the number of bytes required to deliver them.
