1139569 - Animation slowed down when element is expanded in markup view

Status: RESOLVED FIXED

(DevTools :: Inspector, defect)

Description

[Brian Grinstead [:bgrins]]

STR: 

Open http://maxwellito.github.io/vivus/#polaroid
Let the animation finish, then press "Replay" to see the current speed.
Open devtools and inspect the #polaroid SVG element
Press "Replay".  It may be a bit slower, but not too much.
Alt+Click to expand all the children of #polaroid
Press "Replay".  Things are very slow now.

This actually seems much better with e10s so that leads me to believe that it's the markup view frontend causing jank.  We should profile this and improve perf.

It's possible that simply highlighting only the attribute that changed rather than the whole element could improve things, which would be killing two birds with one stone.

Comment 1

[Brian Grinstead [:bgrins]]

Attachment: animation-markupview-profile.json

Profile that shows what is taking a lot of time.  If you invert call tree you can see that _createAttribute is calling template() for every attribute and it is very slow.

Comment 2

[Brian Grinstead [:bgrins]]

Attachment: animation-markupview-profile-screenshot.png

Screenshot of profile

Comment 3

[Brian Grinstead [:bgrins]]

Attachment: markup-attributes-perf.patch

This greatly limits the number of DOM manipulations per mutation and gets rid of the jank on the testcase.  Running some timings for the update() function this appears to take it down from ~4-10ms to ~0-2ms.

Try push: https://treeherder.mozilla.org/#/jobs?repo=try&revision=8b62d0514498

Comment 4

[Patrick Brosset <:pbro>]

Thanks for making that change Brian, this part was always a bit weird to work with.
I was experimenting with re-writing the markup-view recently (with react) and was testing it on sites that mutate a lot of attributes very rapidly, to animate elements via script. I ended up implementing an attribute refresh loop with a rather slow timeout (200ms or so). This helped a lot avoiding the inspector from slowing down the page, and I didn't feel this was visible to the user.

Comment 5

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Comment on attachment 8572939 [details] [diff] [review]
markup-attributes-perf.patch

Review of attachment 8572939 [details] [diff] [review]:
-----------------------------------------------------------------

I had a patch somewhere that used a similar approach and think it is the best we can do for the moment... at least until we rewrite the tool.

When we land this bug 1080884 will also be fixed.

Comment 6

[Brian Grinstead [:bgrins]]

https://hg.mozilla.org/integration/fx-team/rev/1a99e0788665

Comment 7

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/1a99e0788665