Google has recently increased attention to Web Core Vitals (WCV) - a set of website parameters that reflect user interaction with the site, which measures not only server time, but also render time, visual consistency and visual stability of the page. Some sites have seen as much as 50% hit due to issues with Web Core Vitals! The era when you could build huge and slow pages as long as your server responds fast enough, is gone. Now it takes more than that to optimize the site. As you can see, this site running on Drupal, is close to top scores.
Overall, Drupal is very friendly for WCV out of the box. However, some additional modules can help you to optimize the site even further.
1. Lazy Loading.
Lazy Loading only loads the images when they are viewed. This alleviates the initial hit on performance, if all images get loaded and rendered at once, even though they may not be needed. For lazy loading, I use the Lazy module for Drupal. Lazy module has lots of helpful settings and integrates with the lazysizes script.
2. WebP Support.
Overall, a WebP image is twice lighter than a jpg image. WebP allows saving traffic. To enable WebP for responsive images, I use the ImageAPI Optimize WebP support module. It pulls ImageCache API as a dependency. It allows you to create "optimization pipes" for image styles. Creating a WebP optimization pipe and enabling it for every image style will make sure you have WebP alternatives created for each image style. Enabling the WebP support for responsive images will automatically add WebP to responsive images.