图像撕裂原因及解决方法

image.png

先说说图片显示的过程，CPU将图片解码，交给GPU -> GPU进行图像的渲染 -> 存储到到帧缓存区 -> 视频控制器进行读取帧缓存区信息，并刷新部件(视频控制器只是负责帧缓存区与显示器的对应关系) -> 显示器逐行扫描显示。
视频控制器处理缓存第1帧的时候，读取了一部分，帧缓存区更新成了第二帧了，这时，再读取就读取了第2帧的数据，所以看起来像撕裂一样。

怎么解决呢

1. 垂直同步
   其实是将帧缓存区加锁。水平扫描线在垂直方向的堆积形成了完整的画面。显示器的刷新率受显卡DAC控制，显卡DAC完成一帧的扫描后就会产生一个垂直同步信号。当前帧不读取完毕，就不发出读取下一帧的信号。
2. 双缓冲区
   双缓冲区是在帧缓存区中开辟两个缓冲区，一个缓冲区通过视频控制器进行当前帧数据的读取显示，另一个缓冲区进行接收下一帧GPU渲染的图像。两个缓冲区都执行结束，然后再交换缓冲区。

掉帧

掉帧其实就是卡了，这是垂直同步和双缓存区必然遇到的问题（在cpu和gpu处理不过来的时候），
每帧画面的处理时间大概在16.7ms(1s/60 ≈16.7ms)，当超过这个时间，cpu和gpu没准备好第2帧的数据，就会出现掉帧。

image.png

三级缓存区

为了减少掉帧，注意不是解决，是减少掉帧。引入了三级缓存区。
CPU /GPU 会有闲置时间, （A显示屏幕, B也渲染好.），这时CPU/GPU可以再用C进行缓存，减少掉帧的几率。

总结:屏幕卡顿原因:

1. CPU/GPU 渲染流⽔线耗时过⻓->掉帧

2. 垂直同步Vsync + 双缓存区 DoubleBuffering 以掉帧作为代价=>屏幕撕裂

3. 三缓存区: 合理使⽤CPU/GPU 减少掉帧次数;