Page Speed is a ranking factor for Google and important for your website’s user experience. No one likes to wait a long time for a page to display. Use for example Google’s tool Pagespeed Insights to check your website’s performance. Just enter your website's URL and run the check. One aspect of a website that influences page loading is how images are loaded.
With deferred loading images are loaded while the page is already rendering. So they are loaded after the initial page load. This way the initial view can be served faster.
Lazy loading in comparison loads images only on demand. So this method lowers initial page payload and overall load time. If a user does not scroll to the end of a page, these images are never loaded, so it saves transferred data in these cases as well.
Native lazy loading
Joomla! 4 introduced native lazy loading as well:
These infos were about image loading. Some additional optimizations for images are:
- Add images in the size needed. On a lot of websites you find huge images for example with a width of 4.000 pixel that are resized by the browser to 500 pixel. This way the transferred data is bigger than necessary. So scale images before including in your website.
- Add dimensions to your images (width and height), so the browser does not need to calculate the size of the images itself.
- Optimize images and/or use formats with optimized compression like WebP (Read more about Using WebP Images in Joomla! Websites).