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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

core(cls): ignore had_recent_input by timing window #14402

Merged
merged 6 commits into from Mar 22, 2023

Conversation

adamraine
Copy link
Member

@adamraine adamraine commented Sep 20, 2022

Proposal that helps with #14396 for our use cases. We should wait on a chromium fix before closing though.

See my comments for #14396 for the reasoning.

@adamraine adamraine requested a review from a team as a code owner September 20, 2022 19:38
@adamraine adamraine requested review from connorjclark and removed request for a team September 20, 2022 19:38
@connorjclark
Copy link
Collaborator

Perhaps we should consider the alternative approach mentioned in https://bugs.chromium.org/p/chromium/issues/detail?id=1094974#c19 , which both annie and yoav vouched for–do our emulation resizing and wait 500ms before navigating to the page.

@paulirish
Copy link
Member

IMO this a chromium bug. It shouldn't treat a window resize in a previous navigation as "recent input".

https://bugs.chromium.org/p/chromium/issues/detail?id=1302667#c21

@adamraine
Copy link
Member Author

IMO this a chromium bug. It shouldn't treat a window resize in a previous navigation as "recent input".

I agree this should no longer close #14396, but it's still better that what we had before.

@connorjclark
Copy link
Collaborator

Can you confirm the delta in the sample json tests are expected?

@connorjclark
Copy link
Collaborator

connorjclark commented Oct 3, 2022

Although this PR is strictly better, we want to rid ourselves of our hacky "ignore had_recent_input.... sometimes" approach entirely. And we are hesitant to do the 500ms-waiting approach before about:blank nav.

We need to address this as a chromium bug (ref).

Maybe we can determine when the cutoff for CLS events by looking at the navigation (or timespan equivalent) timestamp?

@adamraine
Copy link
Member Author

Can you confirm the delta in the sample json tests are expected?

The delta in the JSON is not expected. I'm going to ping upstream for help.

@adamraine
Copy link
Member Author

I did some investigation. Instead of looking at LS events within 500ms of the time origin, we should look at LS events within 500ms of the first "viewport" event.

Even though emulation is started before navigating, Chrome still triggers a viewport update event after the navigation starts which gets treated as an interaction for LS had_recent_input purposes:
https://bugs.chromium.org/p/chromium/issues/detail?id=1302667#c19

paulirish
paulirish previously approved these changes Mar 21, 2023
const layoutShiftEvents = [];

// Chromium will set `had_recent_input` if there was recent user input, which
// skips shift events from contributing to CLS. This flag is also set when
// Lighthouse changes the emulation size. This results in the first few shift
// events having `had_recent_input` set, so ignore it for those events.
// See https://bugs.chromium.org/p/chromium/issues/detail?id=1094974.
let ignoreHadRecentInput = true;
let mustRespectHadRecentInput = false;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why keep this? If we're confident in the viewport event it seems like keeping our old heuristic just makes things more complicated.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a good point, I suppose the reason is because I'm not confident. Having a surefire exit from our special CSS handling once we see had_recent_input: false could be good logic to keep defensively.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, that's probably fine, there's not a real downside to keeping. I was really only thinking about it because tests like

it('should not count later shift events if input it true', async () => {
const context = {computedCache: new Map()};
const trace = makeTrace([
{score: 1, ts: 1, had_recent_input: true},
{score: 1, ts: 2, had_recent_input: false},
{score: 1, ts: 3, had_recent_input: false},
{score: 1, ts: 4, had_recent_input: true},
{score: 1, ts: 5, had_recent_input: true},
]);
const result = await CumulativeLayoutShift.request(trace, context);
expect(result).toEqual({
cumulativeLayoutShift: 3,
cumulativeLayoutShiftMainFrame: 3,
totalCumulativeLayoutShift: 3,
});
});

seem completely unrealistic now, and hopefully our future selves won't consider them as evidence of essential functionality that needs to be maintained if there are future CLS event changes. Maybe finding this discussion will be enough :)

@adamraine adamraine merged commit c4a177b into main Mar 22, 2023
31 checks passed
@adamraine adamraine deleted the cls-input-time-window branch March 22, 2023 21:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants