首先了解CPU和GPU在计算机中的作用
1、CPU（central processing Unit）中央处理器。是一块超大规模的集成电路，是一台计算机的运算核心和控制核心。它的功能主要是解释计算机指令以及计算机软件的中的数据。
2、GPU（Graphics Processing Unit）图形处理器，是一种专门在个人电脑、工作站、游戏机和一些移动设备（如平板电脑、智能手机等）上图像运算工作的微处理器。是连接计算机和显示终端的纽带。-
撕裂
完美情况：在60FPS内每扫描一张图就不断显示不断刷新图像。掉帧就是因为帧缓存区（旧的数据）显示到了屏幕中而帧缓存区已经拿到了下一帧数据的图像，从而显示到屏幕上出现撕裂的现象。
图像撕裂是我们肉眼看到的一张图片上下发生错位，即断层，其本质是拿到图像后，GPU进⾏渲染->帧缓存区⾥ ->视频控制器->读取帧缓存区信息(位图) -> 数模转化(数字信号处->模 拟型号) ->(逐⾏扫描)显示，当第一帧图像扫描到某个位置时，GPU拿到新的数据并存到帧缓冲区，这个时候视频控制器从帧缓冲区扫描的是新拿到的一帧的图像，最后就形成了在我们肉眼看到的断层现象，即我们看到的一张图片其本质是两张图片组合而来，究其原因就是视频控制器显示速度大于了GPU处理图形的速度
-
解决撕裂
为了解决撕裂，苹果爸爸引入了: 垂直同步Vsync + 双缓存区 DoubleBuffering
(1)垂直同步Vsync:帧缓存区加锁 防⽌出现撕裂情况
(2)双缓存区 DoubleBuffering :就是GPU开辟AB两个帧缓冲区执行流程就是当A帧缓冲区拿到第一帧数据，给A缓冲区加上一把锁，屏幕控制器从A拿到数据并逐行扫描完成，A帧缓冲区解锁，并且屏幕控制器指向B帧缓冲区，B帧缓冲区加锁并逐行扫描显示，在屏幕控制器扫描B帧缓冲区的时候，A帧缓冲区拿到GPU传过来的新一帧数据，以此类推，解决撕裂问题
-
掉帧
掉帧即重复渲染同一帧数据。
image.png为了减少掉帧（注意不是解决，掉帧问题只能尽量的减少，而不是解决，三级缓冲区也有可能出现掉帧），引入三级缓存区，三级缓冲区是为了充分利用CPU/GPU的空余时间，开辟ABC三个帧缓冲区，A显示屏幕, B也渲染好，C再从GPU拿取渲染数据，当屏幕缓冲区和帧缓冲区都弄好了，然后视频控制器再指向帧缓冲区的另外一个，再显示，这样交替，达到减少掉帧的情况，这样做就比二级缓冲区多了一个确认的操作
屏幕卡顿的原因：
1、CPU/GPU渲染流水线耗时过长出现掉帧
2、垂直同步Vsync + 双缓存区DoubleBuffering 以掉帧作为代价解决屏幕撕裂的问题
3、三缓存区：合理使用CPU/GPU，减少掉帧次数。
显示器显示的内容来自帧缓冲区，
视频控制器：控制刷新部件，帧缓冲区与显示器的对应关系进行显示
帧缓存区：颜色值（帧缓冲，显存）
内存：连续的计算机存储器，主要存储刷新图像信息；
位图：60 * 60 = 3600 * 4（RGBA）= 1440;
