Modern Methods For Improving Drupal’s Largest Contentful Paint Core Web Vital

Let’s start with a fairly common example of a hero component on the homepage of Drupal’s demo installation of the Umami theme.
The image in this hero component is loaded by CSS via the background-image property. In order for the browser to display the image, it has a fairly long chain of dependencies:Download the HTML.
Download and parse the CSS.
Reconcile the CSS ruleset with the DOM.
Download the image.
Display the image.
While browsers are generally pretty fast, these steps still