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,Texture,Texture,canvas,Compositor,sharegroup,Chrome合成,合成FBO,ReadBack,swapbuffer,屏幕,最终显示到屏幕上有两种方式，一种是将FBO中合成的数据通过GLReadBack读出来，通过SKIA绘制上屏；还有一种是通过GL的SwapBuffer直接上屏，后者的效率会更高,将合成数据显示到屏幕上,
