屏幕卡顿原因分析

屏幕卡顿原因

V-Sync

V-Sync（垂直同步）指计算机操作系统的一个功能，该功能事实上由来已久，早于Voodoo2的时代V-Sync就已引入到DirectX和Windows操作系统当中，其作用主要是让显卡的运算和显示器刷新率一致以稳定输出的画面质量。

在 VSync 信号到来后，系统图形服务会通过 CADisplayLink 等机制通知 App，App 主线程开始在 CPU 中计算显示内容，比如视图的创建、布局计算、图片解码、文本绘制等。随后 CPU 会将计算好的内容提交到 GPU 去，由 GPU 进行变换、合成、渲染。随后 GPU 会把渲染结果提交到帧缓冲区去，等待下一次 VSync 信号到来时显示到屏幕上。由于垂直同步的机制，如果在一个 VSync 时间内，CPU 或者 GPU 没有完成内容提交，则那一帧就会被丢弃，等待下一次机会再显示，而这时显示屏会保留之前的内容不变。这就是界面卡顿的原因。

CPU影响

各种计算

• 对象创建
• 对象调整
• 对象销毁
• 布局计算
• Autolayout 对于复杂图层会造成卡顿
• 文本计算
• 文本渲染
• 图片解码
• 图像绘制

GPU影响

相对于 CPU 来说，GPU 能干的事情比较单一：接收提交的纹理（Texture）和顶点描述（三角形），应用变换（transform）、混合并渲染，然后输出到屏幕上。通常你所能看到的内容，主要也就是纹理（图片）和形状（三角模拟的矢量图形）两类。

• 纹理的渲染

  短时间显示大量图片

• 视图的混合

  混合需要消耗GPU 减少使用无用Alpha 用opaque代替

• 图形生成

  CALayer 的 border、圆角、阴影、遮罩（mask），CASharpLayer 的矢量图形显示，通常会触发离屏渲染（offscreen rendering），而离屏渲染通常发生在 GPU 中，最彻底的解决办法，就是把需要显示的图形在后台线程绘制为图片，避免使用圆角、阴影、遮罩等属性

第三方框架 ASDK

原理

• Layout

  文本宽高计算，视图布局计算

• Rendering

  文本渲染，图片解码，图形绘制

• UIKit Objects

  对象创建，调整，销毁

ASDK 认为，阻塞主线程的任务，主要分为上面这三大类。文本和布局的计算、渲染、解码、绘制都可以通过各种方式异步执行，但 UIKit 和 Core Animation 相关操作必需在主线程进行。ASDK 的目标，就是尽量把这些任务从主线程挪走，而挪不走的，就尽量优化性能。

具体实现方法

1.ASNode 包装view属性

保证线程安全在后台创建修改，中间变量保存，合适的时机设置

把大量控件封装成ASNode子类，提升性能

2.ASDK 异步并法操作

ASDK 把布局计算、文本排版、图片/文本/图形渲染等操作都封装成较小的任务，并利用 GCD 异步并发执行。如果开发者使用了 ASNode 相关的控件，那么这些并发操作会自动在后台进行，无需进行过多配置

其他方法

预排版

预渲染

异步绘制