...
It is the time from when the user first navigated to the page to when any part of the page content is rendered on the screen
Like TTFB Metrices you can find this metrics in Lighthouse Generated Report similar to the example attached in below image
To provide a good user experience, sites should strive to have a First Contentful Paint of 1.8 seconds or less.
To Reduce the LCP FCP time you need to figure out the critical resources required for FCP and which are not you can find this by right click on website go to inspect and click on 3 dots before cross icon and select run command and run show coverage command. It will give you a report like below image
Identify the critical JS and CSS and move that from render blocking URL to an inline tags because former blocks the parsing of html page. For URL contains non critical JS and CSS mark them with async or defer attributes.
3. Reduce Largest Content full Paint(FCPLCP)
It reports the render time of the largest image, text block or video visible in the viewport, relative to when the user first navigated to the page.
You can find this metrices similar to the TTFB metrices, similar to the example shown in the attached image.
To provide a good user experience, sites should strive to have Largest Contentful Paint of 2.5 seconds or less.
Focus on zero downing delays because other two task is network requests so they definitely take some time.
To reduce the load delay never ever lazy load you LCP resource and try to give them high priority for loading. you can add it by writing below code.
Code Block <img fetchpriority="high" src="/path/to/hero-image.webp">
To Reduce render delay there is not much other than writing optimized CSS and JS and removing unused CSS and JS.
To Reduce the load time try to host the LCP resource on same origin as if it is hosted on different origin browser need to connect to that origin before.
...