htmlcsstooltipcore-web-vitalsweb-vitals

CSS Tooltip harmful for Largest Contentful Paint, how to resolve?


We are using CSS Tooltips, that get visible when the user hovers an element, like in this example: https://www.w3schools.com/css/css_tooltip.asp

We found out recently, that this does harm WebVitals Largest Contentful Paint Measurements, if the tooltip is a bit bigger (just insert some 'lorem ipsums' in the example above).

Any ideas how to implement tooltips, that don't get in danger of harming our LCP web vitals value?


Solution

  • This is a known issue with LCP measurement in Chrome, and there is ongoing work to better measure how often it is happening and what the best fix is. See this bug report: https://bugs.chromium.org/p/chromium/issues/detail?id=1288027

    I'd recommending commenting in that bug with the details of your use case, or starring it to help the team prioritize.