layout: Rewrite the block formatting context/float inline-size

speculation code.

The old code tried to do the speculation as a single bottom-up pass
after intrinsic inline-size calculation, which was unable to handle
cases like this:

    <div>
        <div style="float: left">Foo</div>
    </div>
    <div>
        <div style="overflow: hidden">Bar</div>
    </div>

No single bottom-up pass could possibly handle this case, because the
inline-size of the float flowing out of the "Foo" block could never make
it down to the "Bar" block, where it is needed for speculation.

On the pages I tried, this regresses layout performance by 1%-2%.

I first noticed this breaking some pages, like the Google SERPs, several
months ago.
This commit is contained in:
Patrick Walton 2016-03-18 15:23:08 -07:00
parent 9b2ae3a62f
commit b29719e36b
15 changed files with 346 additions and 184 deletions

View file

@ -564,6 +564,18 @@
"url": "/_mozilla/css/block_formatting_context_containing_floats_a.html"
}
],
"css/block_formatting_context_float_inorder_interaction_a.html": [
{
"path": "css/block_formatting_context_float_inorder_interaction_a.html",
"references": [
[
"/_mozilla/css/block_formatting_context_float_inorder_interaction_ref.html",
"=="
]
],
"url": "/_mozilla/css/block_formatting_context_float_inorder_interaction_a.html"
}
],
"css/block_formatting_context_float_placement_a.html": [
{
"path": "css/block_formatting_context_float_placement_a.html",
@ -6854,6 +6866,18 @@
"url": "/_mozilla/css/block_formatting_context_containing_floats_a.html"
}
],
"css/block_formatting_context_float_inorder_interaction_a.html": [
{
"path": "css/block_formatting_context_float_inorder_interaction_a.html",
"references": [
[
"/_mozilla/css/block_formatting_context_float_inorder_interaction_ref.html",
"=="
]
],
"url": "/_mozilla/css/block_formatting_context_float_inorder_interaction_a.html"
}
],
"css/block_formatting_context_float_placement_a.html": [
{
"path": "css/block_formatting_context_float_placement_a.html",

View file

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<link rel="match" href="block_formatting_context_float_inorder_interaction_ref.html">
<!-- Tests that the speculation of block formatting context inline sizes in the presence of floats
respects the inorder traversal. -->
<style>
* {
margin: 0;
color: white;
}
html {
width: 300px;
border-right: solid skyblue 10px;
}
#a {
float: left;
background: forestgreen;
}
#b {
padding-bottom: 12px;
background: firebrick;
overflow: hidden;
}
</style>
<body>
<div>
<div id=a>Mimi</div>
</div>
<div>
<div id=b>Mimi</div>
</div>
</body>
</html>

View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<!-- Tests that the speculation of block formatting context inline sizes in the presence of floats
respects the inorder traversal. -->
<style>
* {
margin: 0;
color: white;
}
html {
width: 300px;
border-right: solid skyblue 10px;
}
#a {
float: left;
background: forestgreen;
}
#b {
padding-bottom: 12px;
background: firebrick;
overflow: hidden;
}
</style>
<body>
<div id=a>Mimi</div>
<div id=b>Mimi</div>
</body>
</html>