Chris Harrelson
Daniel Cheng
Philip Rogers
Koji Ishi
Ian Kilpatrick
Kyle Charbonneau
Laten we eens kijken naar de belangrijkste gegevensstructuren, die invoer en uitvoer zijn voor de weergavepijplijn .
Deze datastructuren zijn:
- Framebomen zijn samengesteld uit lokale en externe knooppunten die vertegenwoordigen welke webdocumenten zich in welk renderproces bevinden en welke Blink-renderer.
- De onveranderlijke fragmentboom vertegenwoordigt de uitvoer van (en invoer voor) het lay-outbeperkingsalgoritme.
- Eigenschappenbomen vertegenwoordigen de transformatie-, clip-, effect- en schuifhiërarchieën van een webdocument. Deze worden door de hele pijpleiding gebruikt.
- Weergavelijsten en verfbrokken zijn de invoer voor de raster- en gelaagdheidsalgoritmen.
- Compositorframes kapselen oppervlakken, renderoppervlakken en GPU-textuurtegels in die worden gebruikt om te tekenen met behulp van de GPU.
Voordat we door deze datastructuren lopen, bouwt het volgende voorbeeld voort op een voorbeeld uit architecture review . Dit voorbeeld wordt in dit document gebruikt met demonstraties van hoe de datastructuren erop van toepassing zijn.
<!-- Example code -->
<html>
<div style="overflow: hidden; width: 100px; height: 100px;">
<iframe style="filter: blur(3px);
transform: rotateZ(1deg);
width: 100px; height: 300px"
id="one" src="foo.com/etc"></iframe>
</div>
<iframe style="top:200px;
transform: scale(1.1) translateX(200px)"
id="two" src="bar.com"></iframe>
</html>
Kader bomen
Chrome kan er soms voor kiezen om een cross-origin-frame in een ander weergaveproces weer te geven dan het bovenliggende frame.
In de voorbeeldcode zijn er in totaal drie frames: