The problem is like this:
<body style="width:800px;height:600px">
<div id="outer" style="width:200px;height:100px">
<div id="innner" [width and height infered from the content]>
<span>Some content here</span>
<span>Some content here</span>
<span>Some content here</span>
</div>
</div>
</body>
1. Body is created and added to parent which triggers layout on body.
2. Body is measured.
3. Body is laid out.
4. Body is measured again to see if the size changed. (This step can probably
be removed.)
1. Outer is created and added to parent which triggers layout on outer.
2. Outer is measured.
3. Outer is laid out.
4. Outer is measured again to see if the size changed and dispatches an event
if yes.
1. Inner is created and added to parent which triggers layout on inner.
2. Inner is measured.
3. Inner is laid out.
4. inner is measured again to see if the size changed and dispatches an event
if yes.
1. Span 1 is created and added to parent which triggers layout on span 1.
2. span 1 is measured.
3. span 1 is laid out.
4. span 1 is measured again to see if the size changed and dispatches an event
if yes.
1. Span 2 is created and added to parent which triggers layout on span 2.
2. span 2 is measured.
3. span 2 is laid out.
4. span 2 is measured again to see if the size changed and dispatches an event
if yes.
1. Span 3 is created and added to parent which triggers layout on span 3.
2. span 3 is measured.
3. span 3 is laid out.
4. span 3 is measured again to see if the size changed and dispatches an event
if yes.
Delaying execution allows all the step 2s to be executed in one step and all
step 3s to happen together. This prevents invalidation between all the step 2s.
We might get further improvements by adding a queue for the remeasuring as well
so all the step 4s happen after all the step 3s.
As far as invalidation goes, all the measuring does is writes measuredWidth and
measuredHeight. Almost all the time, the measured dimensions will be enough for
the layouts which are running. In cases where not, the layouts can make an
educated decision to use width and height instead of measuredWidth and
measuredHeight.
> On Mar 27, 2018, at 7:38 AM, Alex Harui <[email protected]> wrote:
>
> I still don't get why deferral helps at all unless you can guarantee that
> the code that reads these values will NEVER write a value that invalidates
> the prior computation. In the scenarios described, won't setting scale
> invalidate the DOM? Or setting a parent's width/height based on the
> child's content? I would think the main goal is just to try to coordinate
> the reads (and cache them when possible) and then be smart somehow about
> the writes. I'm not clear you have to wait for a later event, maybe just
> add to a queue that gets called at the end of layout as we have it today.
