search

w3c / largest-contentful-paint

Specification for the LargestContentfulPaint API
https://w3c.github.io/largest-contentful-paint/
Other
88 stars 16 forks source link

Elements that are obscured by other elements shouldn't be considered #70

Open patrickhulce opened 3 years ago

patrickhulce commented 3 years ago

We came across an amusing case in Lighthouse where the LCP element was completely obscured by another element with a higher z-index.

It's definitely unfortunate that LCP flags something that is effectively outside the viewport from the user's perspective. I can imagine that determining occlusion would be computationally expensive (and impossible in some cases) though. Would it be possible to consider more forms of visibility like this in the metric definition? Was there consideration or a discussion on this in the past I can refer to?

npm1 commented 3 years ago

That has definitely come up in the past but doesn't seem super common. You're right that this is not ideal but I will pass on the feedback to the rendering team who will have more informed opinions on whether it is computationally feasible to consider occlusion.

noamr commented 2 years ago

I think the spec shouldn't deal with it. UAs can try to track this and put warning-ish things in their dev-tools like "your LCP is occluded".

yoavweiss commented 1 year ago

@noamr - why shouldn't we handle this at the spec level? (assuming implementation of this is feasible, that's still TBD)

noamr commented 1 year ago

@noamr - why shouldn't we handle this at the spec level? (assuming implementation of this is feasible, that's still TBD)

because occlusion is a really hard problem to solve in an interoperable way. The value of solving it here is not high - if a large image is completely occluded, maybe the occluding content is more important to the users? But this is an opinion and open for discussion.

nhoizey commented 1 year ago

I have noticed the same issue on my photography site where I visually stack some photos above each other. The one in the back if reported as the LCP, while we can see only a little part of it: https://mamot.fr/@nhoizey/110496230467676162

Here's a WebPageTest result: https://www.webpagetest.org/vitals.php?test=230606_BiDc1E_6ZR&run=3&cached=0#lcp

Tricky situation here: the image in the back is overall smaller than the one in the front, but the fold "cuts" the bottom of the later, so the area above the fold considered for LCP is larger for the back image.

But I think the back image should not be the LCP anyway, as we don't see much of it.