Core web vitals are a set of metrics that measure the user experience of web pages. They focus on loading performance, interactivity, and visual stability of page content. The Core Web Vitals metrics are: Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS).
LCP (Largest Contentful Paint) is a metric that measures the time it takes for the largest content element on a page to render. It is a key metric for understanding the performance of a page, as it is the first major visual element that users see when they visit a page.
Optimizing Web Core Vitals results, notes
To speed up the loading of the site and improve performances I’ve removed Facebook script sdk.js and loaded it only when the user requests to login, when the login HTML layer is shown.
Also implemented YouTube facade. YouTube iframe has a js file greater than 500kb!
Final page HTML output is minfied and cached (to minify I’ve used this PHP).
I’ve reduced the size of the CMP to avoid Web Vitals consider it the LCP element. With Quantcast CMP it was a bit tricky, done using their advanced CSS feature (CSS code below in comments).
Another tip read around the web is to remove
lazy attribute from important pic if it is the LCP element (done, but I can’t verify if it is working, since that image was already the LCP element).
Here this site suggests to add
fetchpriority attribute on important image (inserted, but I can’t verify if it is working, since that image was already the LCP element).
I also changed the expiry time of the assets in the CDN, from 1h to 365d, it needs to be checked because there are also JS and CSS resources in the CDN which could be unpleasant to have difficulty refreshing cache. (Not tested, but I have to).
Exaustive article here about image tag and performance CWV.
Fixed all Best practices, SEO and Accessibility pointed by Google page speed test.
I hope this is enough!
TO DO: Check if results get better in Search Console > Essentials.