You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
If an image covers the entire viewport, it's excluded from LCP calculations even when the image is high entropy. We're seeing this happen for all of our mweb pin pages when the user is logged into Pinterest.
LCP ends up being a small image that gets client rendered very late instead of the big hero image that is server rendered.
Here is an example pin page: https://www.pinterest.com/pin/357051076720162800/
The unauth version of the page doesn't have the LCP issue mentioned above because we have the login/signup banner at the top. That pushes the hero image down so that it doesn't cover the viewport. On the auth version of the page (after you log in), the image covers the entire viewport (there is a footer that is overlaid on top of the image at the bottom of the page, but the image is behind it).
From the LCP docs it sounds like images covering the entire viewport are intentionally excluded from LCP calculations as they might be background images, but having an image cover the viewport on a mobile device (with maybe a navigation bar overlaid on top) seems like it could be a common use case for product pages, galleries, and other image focused sites like Pinterest.
The text was updated successfully, but these errors were encountered:
valiantvu
changed the title
High entropy image excluded from LCP due the image covering the viewport
High entropy image excluded from LCP due to the image covering the viewport
Jun 14, 2023
If an image covers the entire viewport, it's excluded from LCP calculations even when the image is high entropy. We're seeing this happen for all of our mweb pin pages when the user is logged into Pinterest.
LCP ends up being a small image that gets client rendered very late instead of the big hero image that is server rendered.
Here is an example pin page: https://www.pinterest.com/pin/357051076720162800/
The unauth version of the page doesn't have the LCP issue mentioned above because we have the login/signup banner at the top. That pushes the hero image down so that it doesn't cover the viewport. On the auth version of the page (after you log in), the image covers the entire viewport (there is a footer that is overlaid on top of the image at the bottom of the page, but the image is behind it).
From the LCP docs it sounds like images covering the entire viewport are intentionally excluded from LCP calculations as they might be background images, but having an image cover the viewport on a mobile device (with maybe a navigation bar overlaid on top) seems like it could be a common use case for product pages, galleries, and other image focused sites like Pinterest.
The text was updated successfully, but these errors were encountered: