changing document.title causes layout thrashing (recalc styles. layout)
Reported by
t...@coinbase.com,
Nov 14 2017
|
||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36 Steps to reproduce the problem: 1. change the document.title frequently 2. use chrome dev tools to profile layout thrashing 3. What is the expected behavior? Changing the document title should not cause layout thrashing What went wrong? I'm building a real-time application that frequently updates the document.title. my users are accustom to this behavior. sometimes the title is updating as frequently as every ~20 ms. Using chrome dev tools, I've noticed that setting document.title causes layout thrashing. I don't know the details, but I don't think this should be required for a simple string change. Did this work before? N/A Does this work in other browsers? Yes Chrome version: 61.0.3163.100 Channel: n/a OS Version: OS X 10.12.6 Flash Version:
,
Nov 15 2017
Sure thing. I've uploaded an index.html where you can profile the issue yourself. As well as a screenshot showing the profiling.
,
Nov 15 2017
Thank you for providing more feedback. Adding requester "krajshree@chromium.org" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Nov 15 2017
RecalcStyle is required because the <title> element may have a visible display value. But layout should not happen unless such a display value is in fact set. Could you upload a trace file using the instructions at https://www.chromium.org/developers/how-tos/submitting-a-performance-bug ? Thanks!
,
Nov 15 2017
Uploaded. Thanks for looking into this.
,
Nov 15 2017
Thank you for providing more feedback. Adding requester "cbiesinger@google.com" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Nov 16 2017
OK, looking at that trace-- We call Document::recalcStyle which I think is unavoidable because changing the title could affect style But we also call Document::rebuildLayoutTree from Document::updateStyle and I don't know why we do that? Why is the NeedsReattachLayoutTree flag set in this case? UpdateLayerTree is expected because that's always there when we update the lifeycle state. Not sure whether LayoutView::commitPendingSelection is expected but I guess so (?) and anyway that's super-quick PrePaint is unconditional So the thing I am mostly wondering about is why style recalc sets NeedsReattachLayoutTree here. Over to the style team
,
Nov 16 2017
setTitle() replaces the text node, which means we detach the existing text node, removes the node and insert a new text node. Inserting the new text node marks the tree for RebuildLayoutTree() as part of style recalc because all new nodes are created with kNeedsReattachStyleChange. This is normally required to properly attach inserted nodes. I don't think that should be strictly necessary when inserting nodes into parents which are display:none.
,
Nov 16 2017
,
Nov 16 2017
,
Nov 28 2017
,
Dec 6 2017
,
Jan 18 2018
,
Jan 18
(5 days ago)
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue. Sorry for the inconvenience if the bug really should have been left as Available. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Jan 21
(2 days ago)
|
||||||||||||
►
Sign in to add a comment |
||||||||||||
Comment 1 by krajshree@chromium.org
, Nov 15 2017Components: Blink>Layout
Labels: Needs-Feedback Needs-Milestone