我们开发的页面是如何渲染到屏幕上的呢:
第一步:CPU(对象的创建和销毁,对象属性的调整,布局计算,文本的计算和排版,和片的格式转换和解码,图像的绘制(CoreGraphics))
这块设计到三个框架CoreAnimation,CoreGraphics,CoreImage CoreAnimation:是一个复合引擎,其职责是尽可能快的组合屏幕上不同的可视内容,这些可视内容可以被分解成独立的图层(CALayer),本质上来讲,CALayer是我们能看到内容的基础 CoreGraphics:主要用于运行时绘制图像 CoreImage:主要用于运行前创建图像
下面这张图是CoreAnimation的流水线,第一阶段Application主要包含1.1和1.2两步
1.1 handleEvents,这一阶段主要处理事件的操作,比如用户的点击事件
1.2 Commit Transcation,这一步主要分为4个阶段
1.2.1 Layout:包括LayoutSubViews,addSubView等
1.2.2 Display:主要用于视图绘制,drawRect方法
1.2.3 Prepare:主要用于图像的解码转换等操作
1.2.4 Commit:主要用于图层打包发送至RenderServer
1.3 RenderServer:这一步主要是通过OpenGL ES或者Metal来调度GUP进行渲染
第二步:GPU(纹理的渲染) 第一步生成的数据是无法直接成像的,需要GUP进行数据的转换(顶点数据-顶点着色器-配置操作-光栅化-片元着色器-RenderBuffer),转换后的一帧的数据会存在我们的帧缓存区里也就是我们平常说的显存,对于苹果而言是双缓存机制(前帧缓存和后帧缓存)
第三步:成像 通过视频控制器从帧缓存区拿到数据后直接显示在屏幕上,对于苹果而言,想要显示一帧(一屏)的数据需要两个信号:水平同步信号(HSync)和垂直同步信号(VSync), 首先会发出一个HSync,逐个渲染水平方向的每一个像素,当一行渲染完成后,重新发出下一行的HSync,当一屏的所有像素都渲染完成后,会发出一个Vsync来从缓存区里获取下一帧的数据进行显示。
那我们的屏幕卡顿是怎样造成的呢?苹果为什么要使用双缓存及垂直同步信号呢?
苹果使用双缓存机制+垂直同步信号是为了避免屏幕撕裂,造成屏幕撕裂是因为有一半是之前的缓存有一半是新的缓存,在完全显示一帧(发出HSync)之前,苹果是不会从帧缓存区获取新的数据,这样就可以完美避免屏幕撕裂,但是这样会造成另外一个效果:掉帧,也就是我们常说的屏幕卡顿 屏幕卡顿是因为当我们一个VSync来的时候,CPU及GPU还未把新的数据放入帧缓存区里,这个时候屏幕控制器就会继续展示之前的帧画面,在视觉效果上就会产生卡顿的现象