You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
116 lines
3.3 KiB
HTML
116 lines
3.3 KiB
HTML
9 years ago
|
<div layout="column" class="slide slide-31">
|
||
|
<!--http://www.slideshare.net/HyungwookLee/android-chromium-rendering-pipeline-->
|
||
|
|
||
|
<div flex="10">
|
||
|
<h4 style="margin-top: 10px; margin-left: 10px">The Hardware Path: GPU</h4>
|
||
|
</div>
|
||
|
|
||
|
<!--Sections-->
|
||
|
<div flex="10" layout="row" layout-align="center center">
|
||
|
|
||
|
<div style="text-align: center" flex="33">
|
||
|
<h3>Browser UI</h3>
|
||
|
</div>
|
||
|
|
||
|
|
||
|
<div class="rendering" style="text-align: center" flex="33">
|
||
|
<h3>Rendering</h3>
|
||
|
</div>
|
||
|
|
||
|
|
||
|
|
||
|
<div class="js" style="text-align: center" flex="33">
|
||
|
<h3>Javascript VM</h3>
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
|
||
|
<div flex="5">
|
||
|
</div>
|
||
|
|
||
|
<!--Rendering-->
|
||
|
<div class="rendering-container" flex="30" layout="row" >
|
||
|
|
||
|
<div flex="33">
|
||
|
</div>
|
||
|
|
||
|
|
||
|
<!--Rendering process-->
|
||
|
<div flex="33" layout="column" layout-fill layout-align="center center">
|
||
|
|
||
|
<div flex layout="row" layout-margin layout-fill layout-align="center center">
|
||
|
<div flex="30" layout="row" layout-align="center start">
|
||
|
<div class="dom-update">
|
||
|
</div>
|
||
|
</div>
|
||
|
<div flex>
|
||
|
<p>dom update</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div flex layout="row" layout-margin layout-fill layout-align="center center">
|
||
|
<div flex="30" layout="row" layout-align="center start">
|
||
|
<div class="layout">
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div flex>
|
||
|
<p>layout</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div flex layout="row" layout-margin layout-fill layout-align="center center">
|
||
|
<div flex="30" layout="row" layout-align="center start">
|
||
|
<div class="paint">
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div flex>
|
||
|
<p>paint</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
|
||
|
<!--CPU-->
|
||
|
<div flex="15" layout="row">
|
||
|
<div style="text-align: center" flex="33">
|
||
|
<img style="width: auto; height: 100px" src="/assets/images/cpu-chip.jpg">
|
||
|
</div>
|
||
|
|
||
|
<div class="cpu-gpu" style="text-align: center" layout-margin flex="66" layout="row" layout-align="space-around center">
|
||
|
|
||
|
<div class="gpu" flex="50" layout="row" layout-align="end center">
|
||
|
<div class="rendering-gpu">
|
||
|
</div>
|
||
|
<img style="width: 100px; height: 100px" src="/assets/images/gpu-chip.jpg">
|
||
|
</div>
|
||
|
|
||
|
<div class="cpu" flex="50" layout="row" layout-align="start center">
|
||
|
<div class="rendering-cpu">
|
||
|
</div>
|
||
|
<div class="js">
|
||
|
</div>
|
||
|
<img class="render-cpu render-js" style="width: auto; height: 100px" src="/assets/images/cpu-chip.jpg">
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<!--Screen-->
|
||
|
|
||
|
<div flex layout="row" layout-align="center center">
|
||
|
<div flex="33" layout="row" layout-align="center center">
|
||
|
<div render delay="6000" framerate="0.25" class="render rendering-screen">
|
||
|
<div class="object">
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
|
||
|
|
||
|
</div>
|