Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Elements without content shouldn't affect LS #45

Closed
patrickhulce opened this issue Jun 5, 2020 · 3 comments
Closed

Elements without content shouldn't affect LS #45

patrickhulce opened this issue Jun 5, 2020 · 3 comments

Comments

@patrickhulce
Copy link

patrickhulce commented Jun 5, 2020

Hi there from the Lighthouse team 馃憢 :)

I'm bringing up an issue that was been raised a few times over in Lighthouse where we expose the CLS of the page (GoogleChrome/lighthouse#10873 is a particularly useful discussion that highlights several rough edges of CLS if you're interested).

The gist is that when dynamically loading in content into an app shell, you have to do some CSS gymnastics to position your loading spinner to ensure that the empty positioning divs don't artificially inflate CLS.

A particularly rough example is https://melodic-class.glitch.me/cls-empty.html which clearly has no user perceived layout shift yet gets a CLS of 0.426

I'm wondering if it could be considered that elements without any content (text or images) are excluded from layout shift.

@skobes
Copy link
Collaborator

skobes commented Jun 26, 2020

Thanks for raising this. It is a known limitation of CLS that we do not currently distinguish elements that don't paint any content (but have non-zero fixed size).

I have filed crbug.com/1099350 to track exploring better ways of handling this in Chromium.

@wangxianzhu
Copy link

wangxianzhu commented Feb 4, 2021

Should this be merged into #61?

@skobes
Copy link
Collaborator

skobes commented Feb 5, 2021

Duplicate of #61

@skobes skobes marked this as a duplicate of #61 Feb 5, 2021
@skobes skobes closed this as completed Feb 5, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants