1850809 - 1.75x slower than Chrome computing style on NewsSite-Next + NewsSite-Nuxt

Status: NEW

(Core :: CSS Parsing and Computation, enhancement)

Description

[Markus Stange [:mstange]]

https://speedometer-preview.netlify.app/?suite=NewsSite-Nuxt&iterationCount=50

On the Speedometer 3 subtest "NewsSite-Nuxt", Firefox spends 1.75x as much time in mozilla::ServoStyleSet::StyleDocument as Chrome spends in blink::StyleEngine::RecalcStyle.

Firefox: https://share.firefox.dev/3YWCvLf 11376 samples
Chrome: https://share.firefox.dev/3sw5nho 6469 samples

Matching Chrome's speed on this part of the test would improve Firefox's overall score on NewsSite-Nuxt by 9.6%.

Comment 1

[Markus Stange [:mstange]]

A large part of that is in transition handling, which is covered under bug 1850812.

But if you subtract out Gecko_UpdateAnimations, we're still 1.3x slower:
Firefox: https://share.firefox.dev/3EgRGp8 8663 samples
Chrome: https://share.firefox.dev/3sw5nho 6469 samples

Closing the gap on just this part would improve Firefox's overall score on NewsSite-Nuxt by 4.3%.

Comment 2

[Emilio Cobos Álvarez (:emilio)]

So I had a hunch about this when poking at the page, and visited link styling seems to add a lot of overhead to the cascade.

Markus, could I ask you to run the comparison with layout.css.visited_links_enabled=false and see if the difference goes away?

Comment 3

[Markus Stange [:mstange]]

Setting that pref to false reduces our style time by 7.5% from 4295 to 3973 samples, but Chrome's time is still quite a bit lower at 2578 samples.

Firefox with layout.css.visited_links_enabled=true, time spent in mozilla::ServoStyleSet::StyleDocument minus time spent in
Gecko_UpdateAnimations: https://share.firefox.dev/3Fx3Ta5 4295 samples
Firefox with layout.css.visited_links_enabled=false, time spent in mozilla::ServoStyleSet::StyleDocument minus time spent in Gecko_UpdateAnimations: https://share.firefox.dev/3Ffb3Q6 3973 samples
Chrome, time spent in blink::StyleEngine::RecalcStyle minus time spent in blink::StyleResolver::ApplyAnimatedStyle: https://share.firefox.dev/3txJu1S 2578 samples

Comment 4

[Markus Stange [:mstange]]

This is still the biggest bucket of difference on the NewsSite tests. Emilio, here's a comparison report of NewsSite-Next with today's Nightly, and also a comparison report with layout.css.visited_links_enabled=false. In the latter report, the difference in style time still amounts to 7.5% of the test overall.

Can you take another look?

Comment 5

[Emilio Cobos Álvarez (:emilio)]

So, some bits that stand out:

• needs_transitions_update is around 7.3% of the time inside style computation here. That is because approx. 20% of elements have a transition: all .3s ease. It seems we could speed this up quite a bit. I commented on bug 1876263 with an idea to remove that chunk ~completely.

• There's some other custom property substitution code that shows up a bunch. One potential idea to optimize that could be to store the original input indices in the variable reference set (so, make that something like a HashMap<Name, SmallVec<[usize; 2]> or so, or perhaps something a bit smarter, or just a list of references). That should allow us to not re-tokenize during substitution, which seems like it should be a win, but not sure how big off-hand.

Comment 6

[Emilio Cobos Álvarez (:emilio)]

Any chance to get a comparison against chrome again?

Comment 7

[Markus Stange [:mstange]]

New comparisons: NewsSite-Next, NewsSite-Nuxt

Comment 8

[Jeff Muizelaar [:jrmuizel]]

The latest data suggests making Firefox as fast as Chrome on this function would reduce its time by 12.3%.

Comment 9

[Emilio Cobos Álvarez (:emilio)]

New comparisons: Next, Nuxt

There are also some interesting things:

• The transitions issue in bug 1876263 is still relevant (not unexpected).
• Frame construction shows up a bit disproportionately for us (maybe hitting a slow path?)
• There are some quotes and counters updates that are a bit unexpected.