Chromimum Android渲染介绍

大鹏一日同风起,扶摇直上九万里。这篇文章主要讲述Chromimum Android渲染介绍相关的知识,希望能为你提供帮助。
从概念上一个使用硬件加速(AC)时, 页面显示的结构是Viewport -> Layer(s) -> Tile(s), 所谓的纹理就是Tile上显示的内容。分块最大的好处就是重绘的单元变小, 更利于降低系统开销。
(Tile翻成瓦片, 还不如瓷砖呢 ^_^!)

Chromimum Android渲染介绍

文章图片

详情可参考:开启硬件加速时Web页面绘制流程。
从WebKit内核到Chromium的cc模块, 其对应关系如下:
Chromimum Android渲染介绍

文章图片

Chormium通过impl-side painting实现了多线程的渲染(Design Document)。其目的是将WebKit内核的页面内容绘制与实际显示隔离开来, 再将painting操作分为recording和rasterization。
其中一个重要的概念是Main Thread(side)和Impl Thread(side)。
Chromimum Android渲染介绍

文章图片

Main Thread运行于Render线程, 包括RenderWidget, LayerTreeHost等。Impl Thread运行于Compositor线程, 包括LayerTreeHostImpl等。两者通过一个Proxy进行线程的通讯。基本的渲染路径就像是dot绘图一样, 先录制脚本, 再生成图像。它使用的对象是SkPicture, 它能做到类似Display List的功能, 能够记录, 再播放。这也是跨进程渲染的基础( 必然需要一个编码及解码的过程。) 。
步骤如下:
* 在Main Thread里, Chromium/WebKit的渲染到一个图形后端(SkPicture)存储起来, 由LayerTreeHost管理整个Layer Tree。 这个过程叫Record, 并没有真正绘制。
* 将这些数据提交到Impl Thread里的LayerTreeHostImpl进行给制, 这个过程是Upload,还有一个Commit。
* LayerTreeHostImpl再通过AwContents, 使用android的GL功能进行合成绘制, 这个过程叫Rastering (光栅化, 其实就是用位图显示的概念,对应于矢量方式绘图.)。
结构上, LayerTreeHost与LayerTreeHostImpl构成了Main Thread和Impl Thread的交互界面。
初始化时, 流程从RenderViewImpl的创建开始, 如下图所示(ThreadProxy是Proxy的实现):
Chromimum Android渲染介绍

文章图片

为了更好地安排Main Thread与Impl Thread的任务队列, 还会有一个Scheduler负责任务安排。 以下是类的关系, 可以看到它们的生命周期管理:
Chromimum Android渲染介绍

文章图片

Main Thread(Side) LayerTreeHost/LayerTreeHostImpl只是组织和事务处理的类, 实际绘制时是以OutputSurface为基础的, 可以理解为图形后端。Android WebView和CC都是基于对OutputSurface的操作来完成后面的合成的。Chromium WebView使用同步合成器, 即SynchronousCompositor, 在UI线程上使用系统的GL能力绘制。后面有一串以SynchronousCompositor命名的类。
首先当LayerTreeHostImpl准备好后, 会向LayerTreeHost请求OutputSurface, 最终由RenderWidget通过SynchronousCompositorFactory创建出一个OutputSurface,并交给LayerTreeHostImpl管理(scoped_ptr)。
Chromimum Android渲染介绍

文章图片

Impl Thread(Side) 在Impl side, AwContents中合成器管理操作是由BrowserViewRenderer负责的, 它将主要通过SynchronousCompositorImpl来向LayerTreeHostImpl和OutputSurface提供服务的。
Android WebView的设计中一个WebContents对应一个合成器, 所以SynchronousCompositorOutputSurface通过routingid就可以确认所对应的SynchronousCompositorImpl。
Android上将Impl Thread实际是跑在UI线程上的, 即child compositor运行在UI线程上。详细的说明参考 Urbercomp in Android WebView, 里面有详细的说明。
以下为主要类的关系:
Chromimum Android渲染介绍

文章图片

参考资料: Android 4.4 Browser渲染机制解析。
附上OutputSurface的初始化及绑定流程如下:
Chromimum Android渲染介绍

文章图片

当开始绘制时, 为了支持DrawGL函数(下面有介绍), 还会创建一个OutputSurface。析构时依次析构, 流程如下:
Chromimum Android渲染介绍

文章图片

TileSet & Layer 【Chromimum Android渲染介绍】对应于上面的TileSet和Layer,Chromium是由PictureLayerImpl来实现的。以下为其类图, 没有深入研究, 仅作参考:
更为系统的介绍看这里Chromium Graphics: 再谈Chromium WebView硬件渲染模式的演进。
参考
  1. Web页面渲染及合成加速( 二)
  2. Chromium Graphics: 再谈Chromium WebView硬件渲染模式的演进
  3. 开启硬件加速时Web页面绘制流程
  4. Impl-Side Painting
  5. Android Graphics Architecture

    推荐阅读