Bug 26406 - Would like Inspector to show what JS caused relayouts/repaints
Summary: Would like Inspector to show what JS caused relayouts/repaints
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (Deprecated) (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Enhancement
Assignee: Nobody
Keywords: InRadar
Depends on:
Reported: 2009-06-15 08:49 PDT by Adam Roben (:aroben)
Modified: 2010-11-04 14:51 PDT (History)
4 users (show)

See Also:


Note You need to log in before you can comment on or make changes to this bug.
Description Adam Roben (:aroben) 2009-06-15 08:49:11 PDT
We've seen examples of a site calling element.clientWidth (or similar) inside a loop, making that site slow due to the relayout that each clientWidth call requires. It would be great for the Inspector to indicate what JS caused a relayout (or repaint) so that web developers could find and fix these problems.
Comment 1 Adam Roben (:aroben) 2009-06-15 08:49:56 PDT
One idea Hyatt, Tim, and I discussed is to show when relayouts/repaints happened on a timeline. Then you could have some way of finding out the JS backtrace that was active at the time of the relayout/repaint (if any).
Comment 2 Adam Roben (:aroben) 2009-06-15 08:55:37 PDT
If we do put this information into a timeline, it probably makes sense to unify it with the resource-loading timeline in the Resources panel. See bug 26407 for another idea which might warrant extending the resource-loading timeline to show more types of information.
Comment 3 Patrick Mueller 2009-06-22 10:57:27 PDT
See also Bug 26317 ; the referenced paper discusses general ideas regarding debugging information based on events.  It would be useful to see ALL the events fired over a period of time, be able to filter those, etc.
Comment 4 Adam Roben (:aroben) 2010-11-04 07:53:21 PDT
Comment 5 Timothy Hatcher 2010-11-04 14:51:10 PDT
The Timeline panel has this info.