CHROME渲染合成框架.ppt

chrome渲染合成框架chrome与webkit的交互chrome构建合成树chrome更新过程chrome合成过程 chrome渲染合成框架 chrome渲染合成框架 chrome渲染合成框架 chrome与webkit的交互 renderlayer renderlayerbacking cclayerimpl layerchromium graphicslayer graphicslayerchromium renderlayerbacking作为判断是否需要合成layer的关键 是由renderlayercompositor的创建的 这个类会根据needstobecompositied这个接口判断是否需要为当前的renderlayer创建renderlayerbacking 同时也会创建与平台相关的graphicslayer chrome中就是graphicslayerchromium chrome与webkit的交互 renderlayercompositor renderlayerbacking needstobecompositied graphicslayer canvas与webgl的处理 chrome与webkit的交互 canvas webgl 会根据canvascontext创建的imagebuffer判断是否需要创建renderlayerbacking renderlayer renderlayerbacking 会根据webglcontext的创建直接返回true renderlayercompositor requirescompositingforcanvas 在硬件合成模式下 canvas通过创建imagebuffer这个对象来初始化glcontex vbo fbo texture等gl相关数据 这个对象会在canvas初始化context的时候创建 canvas对应的renderlayer也会根据imagebuffer的存在创建layerbacking chrome与webkit的交互 canvasrenderingcontext2d imagebuffer texture glcontext fbo createacceleratedcanvas canvas的context webgl只有硬件渲染的模式 通过创建drawingbuffer来初始化一系列gl的操作 webgl的context与gl的context类似 初始化的时候 也会创建colorbuffer depthbuffer stencilbuffer gles2不能同时挂深度与模板两个缓冲区 chrome与webkit的交互 webglrenderingcontext drawingbuffer fbo texture glcontext color depth stencil chrome中分为软件渲染和硬件合成渲染 后者是在当前网页中包含一个或多个需要合成的layer时启用的 也就是说当renderlayer树中包含有renderlayerbacking的结点时 合成渲染就会启用 此时会初始化一系列和合成相关的对象 为后面的合成渲染做准备 chrome与webkit的交互 renderlayercompositor 初始化chrome合成 webviewimpl webkit chrome chrome与webkit的交互 cclayertreehost ccsinglethreadproxy cclayertreehostimpl layerrenderchromium fboglcontext 需要对网页进行合成渲染后 进行一系列合成需要的初始化操作 chrome构建合成树 renderlayer renderbacking graphicslayer layout layerchromium 当网页执行layout的时候 会根据当前网页若需要合成 则进行rebuildcompositinglayertree rebuildcompositinglayertree renderlayercompositor chrome构建合成树 renderlayer树 graphicslayer树 layerchromium树 renderlayerbacking canvas webgl canvas2dlayerchormium webgllayerchromium canvasrenderingcontext canvas2dlayerchromium和webgllayerchromium分别作为对应的canvasrenderingcontext的platformlayer 在构建layerchromium树的时候将其加入 renderlayerbacking updategraphicslayerconfiguration chrome构建合成树 canvasrenderingcontext renderlayerbacking graphicslayer layerchromium canvaslayerchromium webgllayerchromium chromium中更新layer的rect主要是在cclayertreehost这个类的updatelayers接口中做的 主要流程 chrome更新过程 根据刷新区域计算需要更新的layerchromium 根据刷新区域计算需要更新的layer区域 调skia画软件部分 canvas执行flush操作 对软件部分进行分块 计算每块tile更新区域 chrome更新过程 calculatedrawtransformsandvisibility calculatedrawtransformsandvisibilityinternal walklayersandcalculatevisiblelayerrects paintlayercontents preparetoupdate paintlayer paintcontentsifdirty cclayertreehostcommon cclayertreehost canvas2dlayerchromium tiledlayerchromium renderlayer cclayertreehost updatelayers chrome更新过程 update ccsinglethreadproxy docommit updatetexturerect cctextureupdater bitmapcanvaslayertextureupdater upload layertexturesubimage texsubimage2d gl 这些操作是将软件绘图部分的bitmap导入到需要更新的tile的texture中 chrome更新过程 layerchromium树 cclayerimpl树 treesynchronizer synchronizetrees 在docommit的最后 会将cclayertreehost下管理的layerchromium树信息同步到cclayerhostimpl管理的cclayerimpl树上 为后面drawlayers的合成绘制做准备 canvas webgl textureid textureid chromium合成 drawlayers calculaterenderpassed drawquad cclayertreehostimpl layerrenderchromium drawcanvasquad drawtilequad gl 绘制前将cclayerimpl转化成quad类型 然后根据layer的不同类型 调用不同的drawquad进行绘制 最后将每块layer的texture合成到要显示到屏幕上的fbo上 需要注意的是 这里的gl操作是由合成的context操作的 之所以可以绑定之前context下的texture 是因为使用了sharegroup的机制 chromium合成 glcontext glcontext texture texture te