一：界面卡顿

产生卡顿的原因：掉帧

一帧数据从处理到界面显示流程：

CPU作用：计算一些显示的内容、视图的创建、视图的布局、设置文本、文本的绘制提交给GPU

GPU作用：视图的渲染提交给 frame Buffer

frame Buffer的作用：帧缓冲区，让video controller来读取数据

video controller：到video controller中去逐帧的读取数据提供给Monitor

Monitor：显示器，将读取的数据显示出来

图（1）

掉帧的原因：显示层发送VSync(垂直信号)，1秒处理60帧数据，在双缓冲区中读取数据，在切换的过程中，CPU到GPU的过程中某些原因导致数据处理过长，就会产生丢帧

图(2)

二：卡顿检测

a:YYkit中的fps检测：

图(3) 图(4)

b:RunLoop来监控卡顿状态：

图(5) 图(6)

c:matrix-wechat监控卡顿状态：

图(7)

三：界面优化处理

1：预排版 + 内存缓存

图（8）

2、预解码&预渲染

图(9) 图(10)

SDWebImage中Decode流程

图(11)

3、按需加载

图(12) 图(13)

4、异步渲染：把view和layer的操作分解

图(14)

    1、View负责手势，view的底层通过layer来驱动的

    2、View显示，layer负责内容的绘制

    3：view是layer的代理