Improving the performance of a web page
In this section, we will look at some of the mechanisms available in HTML that allow us to optimize and tweak how resources load on a web page. Controlling the load according to your specific requirements, making sure the right assets load upfront when needed, and loading less urgent resources with lower priority can help us get a rendered web page faster, improving our FCP and LCP scores.
Controlling how assets load
Images can bring a web page to life but, equally, they can bring a web page to a grinding halt while thousands of unoptimized images, amounting to many MB of data, are downloaded over a slow or intermittent connection.
Info
According to the Web Almanac state of the web report for 2022, the median page weight for a mobile website was 2,019 KB, with images contributing 881 of those KB (https://almanac.httparchive.org/en/2022/page-weight#page-weight-by-the-numbers).
When a browser parses an HTML document, it will do so...
