iOS图像显示原理、UI卡顿掉帧、异步绘制、离屏渲染

1、CPU工作：

Layout ：UI布局（frame、size）、文本计算

Display： 绘制（drawRact）

Prepare：图片编解码（UIImage等）

Commit： 位图提交

2、GPU渲染管线（OpenGL渲染管线）

顶点着色、图元装配、光栅化、片段着色、片段处理------->所有处理完成后，将像素点提交到帧缓冲区（FrameBuffer）。

一、UI卡顿、掉帧原因

1s有60帧画面

二、优化方案

CPU：

子线程异步操作： 

对象创建、销毁、调整；

预排版（布局计算、文本计算）；

预渲染（文本等异步绘制、图片编解码等）

GPU：

避免纹理渲染（圆角、动画、蒙层等），可以异步绘制避免

避免视图混合（层级复杂等），可以异步绘制避免

三、异步绘制

.layer setNeedDisplay 方法调用后系统不会马上调用 [CALayer display]，而是在当前 layer 打上一个脏标记，会等到当前 Loop 将要结束时再调用 display 方法执行

系统绘制流程：

异步绘制：

--- [layer.delegate  dispayer:]

· 代理负责生成对应的 bitmap

· 设置该 bitmap 作为 layer.contents 属性的值

流程：

四、离屏渲染

在屏渲染(On-Screen Rendering)：

当前屏幕渲染，指GPU的渲染操作是在当前用于显示的屏幕缓冲区中进行

离屏渲染(Off-Screen Rendering)：

离屏渲染，指GPU在当前屏幕缓冲区以外新开辟一个缓冲区进行渲染操作（圆角属性、蒙层操作等）

何时触发：

· 圆角（当和 maskToBounds 一起使用时）

· 图层蒙版

· 阴影

· 光栅化

为何要避免：

· 创建新的渲染缓冲区，内存开销增加

· 上下文切换，因为多通道渲染管线的合成

· 增加GPU工作量，可能会导致CPU+GPU操作时间超出了一帧16.7s ，会导致卡顿、掉帧