WebKit Bugzilla
New
Browse
Search+
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED FIXED
156250
Web Inspector: Aggressive DOM updates slow down page and Inspector (protocol starving)
https://bugs.webkit.org/show_bug.cgi?id=156250
Summary
Web Inspector: Aggressive DOM updates slow down page and Inspector (protocol ...
Jamie White
Reported
2016-04-05 14:21:37 PDT
Created
attachment 275695
[details]
Simple test page Steps to reproduce: 1. Load the test page 2. Click "Start" 3. Open the inspector with alt+cmd+i (should open on elements tab with body closed) 4. Note ms/frame (~10 on my early 2015 MacBook Air) 5. Switch to console tab 6. Note ms/frame increases (~40 on my machine) To be clear: I expect some slow down when the elements tab is open, but only modest slow down when the console tab is open.
Attachments
Simple test page
(1.34 KB, text/html)
2016-04-05 14:21 PDT
,
Jamie White
no flags
Details
View All
Add attachment
proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1
2016-04-05 14:23:28 PDT
<
rdar://problem/25561452
>
Timothy Hatcher
Comment 2
2016-04-05 15:12:46 PDT
The protocol traffic from the DOM agent is starving things. You basically can't do anything in the Inspector with this much protocol traffic. We should look at coalescing the DOM agent events. Note: Chrome Canary DevTools hang worse for me. I can't even type in the Console there. If you start on Console in Chrome, you are fine. But if you ever show the Elements panel, and later switch to Console is hangs. I can type in Safari Web Inspector, just without autocomplete results, or anything happening quickly after pressing enter.
Jamie White
Comment 3
2016-04-06 01:05:09 PDT
Honestly this repro is more of a generic stress test. Did you see the effect I mentioned where the lag is only introduced after switching inspector tabs?
Timothy Hatcher
Comment 4
2016-04-06 07:11:18 PDT
Yes, switching tabs does have an effect in Web Inspector. The effect is much worse in Chrome Dev Tools. We should fix this. In general any where the page is busy, that causes a lot of Inspector protocol traffic, which makes it hard to do any outgoing commands. Also it taxes the CPU and starves the Web Inspector process.
Blaze Burg
Comment 5
2016-12-22 17:49:04 PST
We did some performance work for this. Please reopen if you find pages that stall out still (and are not stupid microbenchmarks).
Jamie White
Comment 6
2016-12-22 22:13:53 PST
Thanks Brian. Just to clarify: is the "Simple test page" attached to this ticket an example of a stupid microbenchmark? (Totally frank question, keen to learn what constitutes a useful repro).
Blaze Burg
Comment 7
2016-12-23 12:21:00 PST
(In reply to
comment #6
)
> Thanks Brian. Just to clarify: is the "Simple test page" attached to this > ticket an example of a stupid microbenchmark? (Totally frank question, keen > to learn what constitutes a useful repro).
I hate to be dismissive, but unfortunately yes :(. I was using d3 SVG animations (from d3 gallery) as a more realistic test case that does spam attribute changes. In trunk it is not silky smooth but it's usable at least. If you find otherwise, then there is cause to optimize it further.
Jamie White
Comment 8
2016-12-23 13:13:01 PST
Ok, that's useful to know. The original case that led to this ticket was an ember app that slowed down noticeably with the inspector open (it still does) but I figured there was way too much noise to be useful so whittled it down to something minimal that still demonstrated the particular issue.
Blaze Burg
Comment 9
2016-12-23 15:12:46 PST
(In reply to
comment #8
)
> Ok, that's useful to know. The original case that led to this ticket was an > ember app that slowed down noticeably with the inspector open (it still > does) but I figured there was way too much noise to be useful so whittled it > down to something minimal that still demonstrated the particular issue.
Performance here also depends on the distribution of attribute updates to DOM elements, how often elements are added/removed, how many different properties are being changed, etc. It would probably be better to start with the real world example so that I can capture some of these properties before trying to optimize our implementation.
Jamie White
Comment 10
2017-01-01 22:27:29 PST
Just a note that the issues I described previously match those described here:
https://bugs.webkit.org/show_bug.cgi?id=158117
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug