Closed
Bug 1373416
Opened 7 years ago
Closed 7 years ago
stylo: Restyling is significantly slower than initial styling
Categories
(Core :: CSS Parsing and Computation, defect)
Core
CSS Parsing and Computation
Tracking
()
RESOLVED
WORKSFORME
People
(Reporter: bholley, Unassigned)
References
(Depends on 1 open bug, Blocks 1 open bug)
Details
STR: (1) Start a recent build with STYLO_THREADS=1 (2) Start the gecko profiler (3) Open up the web console (4) Load a local obama wikipedia page (5) Paste [1] into the web console. (6) Stop the profiler. Profile: https://perfht.ml/2sxsgRu Note that the initial Servo_StyleSubtree takes 52 ms, whereas the second one takes 80ms, _and_ is followed by another 35ms of ProcessPostTraversal. Restyling will always be _somewhat_ slower, because: * We need to do slightly more work to determine which elements need styling. * We need to compute change hints. * We need to drop all the old data, in addition to allocating the new stuff. But there's still a bunch of dumb stuff we're doing here that's costing us way too much. I'll file dependent bugs. [1] var count = 0; function traverseDescendants(root) { count++; let children = root.children; for (var i = 0; i < children.length; ++i) { let child = children[i]; traverseDescendants(child); } }; var start = performance.now(); traverseDescendants(document); console.log(performance.now() - start);
Reporter | ||
Comment 1•7 years ago
|
||
(In reply to Bobby Holley (:bholley) (busy with Stylo) from comment #0) > [1] > var count = 0; function traverseDescendants(root) { count++; let children = > root.children; for (var i = 0; i < children.length; ++i) { let child = > children[i]; traverseDescendants(child); } }; var start = performance.now(); > traverseDescendants(document); console.log(performance.now() - start); Whoops, wrong blob from my scratch textfile. I meant: var start = performance.now(); var s = document.createElement('style'); s.innerHTML = '*|* { color: red }'; document.head.appendChild(s); window.getComputedStyle(document.body).color; console.log(performance.now() - start);
Reporter | ||
Comment 2•7 years ago
|
||
And I guess it makes a bit more sense to work on: var start = performance.now(); var s = document.createElement('style'); s.innerHTML = '*|* { color: red }'; document.head.appendChild(s); s.remove(); window.getComputedStyle(document.body).color; console.log(performance.now() - start); Which doesn't add the counfounding factor of actually styling with the *|* red rule. That gives us the following profile, with similar characteristics: https://perfht.ml/2sygSEC
Reporter | ||
Comment 3•7 years ago
|
||
Just re-profiled, and I get comparable numbers ignoring considering accumulate_damage and ignoring the post-traversal.
Status: NEW → RESOLVED
Closed: 7 years ago
Resolution: --- → WORKSFORME
You need to log in
before you can comment on or make changes to this bug.
Description
•