LibWeb: Only apply style for continuation nodes once

This fixes the very, _very_ slow loading of https://yzy-sply.com. The
`apply_style()` method also calls into this method recursively, so we
just need to call it once instead of once per node in the continuation
chain.
This commit is contained in:
Jelle Raaijmakers 2025-02-04 23:05:37 +01:00 committed by Alexander Kalenik
commit d94906fa1a
Notes: github-actions[bot] 2025-02-05 13:35:17 +00:00
2 changed files with 26 additions and 4 deletions

View file

@ -1316,10 +1316,11 @@ CSS::UserSelect Node::user_select_used_value() const
void NodeWithStyleAndBoxModelMetrics::propagate_style_along_continuation(CSS::ComputedProperties const& computed_style) const void NodeWithStyleAndBoxModelMetrics::propagate_style_along_continuation(CSS::ComputedProperties const& computed_style) const
{ {
for (auto continuation = continuation_of_node(); continuation; continuation = continuation->continuation_of_node()) { auto continuation = continuation_of_node();
if (!continuation->is_anonymous()) while (continuation && continuation->is_anonymous())
continuation = continuation->continuation_of_node();
if (continuation)
continuation->apply_style(computed_style); continuation->apply_style(computed_style);
}
} }
void NodeWithStyleAndBoxModelMetrics::visit_edges(Cell::Visitor& visitor) void NodeWithStyleAndBoxModelMetrics::visit_edges(Cell::Visitor& visitor)

View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<span></span>
<script>
document.addEventListener('DOMContentLoaded', () => {
// Create a long continuation chain
const spanElm = document.querySelector('span');
for (let i = 0; i < 200; ++i) {
spanElm.appendChild(document.createTextNode('a'));
let divElm = document.createElement('div');
divElm.appendChild(document.createTextNode('b'));
spanElm.appendChild(divElm);
}
// Force layout
document.body.offsetWidth;
// Trigger style propagation. This does not necessarily crash, but it verifies that this action completes
// within reasonable time instead of hanging indefinitely.
document.body.style.fontSize = '10px';
});
</script>