1598268 - Parsing CSS takes significant amount of main thread time when loading Youtube

Status: NEW

(Core :: CSS Parsing and Computation, enhancement)

Description

[Olli Pettay [:smaug][[e-mail]]]

https://perfht.ml/2raumXU

Could we possibly parse the style sheet off the main and only after that add the element to DOM or something?

Comment 1

[Emilio Cobos Álvarez [:emilio]]

Attachment: StyleSheet (for reference)

This is the biggest one, the others are fairly minor.

Comment 2

[Emilio Cobos Álvarez [:emilio]]

Attachment: Benchmark

Comment 3

[Emilio Cobos Álvarez [:emilio]]

Note that Chrome and WebKit have lazy css parsing, so they seem to parse the sheet faster, though they pay the price of parsing the declarations later, when they get used. Of course in the benchmark they don't get used though.

Comment 4

[Emilio Cobos Álvarez [:emilio]]

I see us on par with Chrome nowadays, can you still repro this? https://share.firefox.dev/3sCQHNt doesn't show much css parsing now.

Comment 5

[Olli Pettay [:smaug][[e-mail]]]

On linux Chrome seems to be still 25% faster in that testcase
But let me profile too

Comment 6

[Olli Pettay [:smaug][[e-mail]]]

https://share.firefox.dev/3R81cTd looks similar to yours. So we're still taking non-trivial amount main thread time.
And at least on warm page loads we're behind Chrome.
So I think this is still valid.

Too bad the initial profile isn't really available anymore - at least it doesn't show any profile data for me.