背景
最近在做Flutter知识学习的时候，有时间会看到vsync信号，不知道所谓何物，所以专门抽时间简单学习了一下，以此篇文章做个记录，具体内容请查看我的参考资料即可
图像生成到缓冲区
- GPU这个概念是由Nvidia公司于1999年提出的。GPU是显卡上的一块芯片，就像CPU是主板上的一块芯片
- 下面矩形框里面的应该就是显卡了
CPU和显卡知乎解释
- CPU 绘制 View 树，计算好图形数据，提交到系统内存中
- CPU提交完成以后，通知 GPU 计算完成，系统总线会把数据拷贝到 GPU 的显存里
- GPU 开始处理数据，以特定的 显卡帧率 把数据写到显卡的缓冲区里
- 视频控制器收到 垂直同步信号 ，逐行读取帧缓冲区的数据，交给显示器
- 显卡帧率：即 Frame Rate，单位 fps，是指 gpu 生成帧的速率，如 33 fps，60fps，越高越好。
#单缓冲
单缓冲，也就是只有一个缓冲区（buffer），GPU 向 buffer 中写入数据，屏幕从 buffer 中取图像数据、刷新后显示，理想的情况是 显卡帧率 和 屏幕刷新频率 相等，每绘制一帧，屏幕显示一帧。而实际情况是，二者之间没有必然的大小关系，如果没有同步机制，很容易出现问题。
- 例如，当显卡帧率大于屏幕刷新频率，屏幕准备刷新第2帧的时候，GPU 已经在生成第3帧了，就会覆盖第2帧的部分数据。
- 当屏幕开始刷新第2帧的时候，缓冲区中的数据一部分是第3帧数据，一部分是第2帧的数据，显示出来的图像就会出现明显的偏差，也就是撕裂（
tearing）。
#双缓冲
为了单缓冲的撕裂和效率问题，双缓冲诞生了。
双缓冲有两个缓冲区：frame buffer、back buffer，GPU 向 back buffer 中写数据，屏幕从 frame buffer 中读数据。这样不仅可以提升效率，而且可以避免因为帧率和刷新率不一致，导致图像数据错乱。
但是这两个 buffer怎么去同步呢？这里就需要 垂直同步信号 了
当开启垂直同步后，就会变成这样：
- GPU 会等待 垂直同步信号 发出后，复制
back buffer的数据到frame buffer里（交换两个缓冲区的内存地址） - 渲染下一帧数据，写到缓冲区里
这样看来，帧率大于刷新频率时，帧率就会被迫跟刷新频率保持同步，从而避免撕裂现象。
需要注意的是，双缓冲 + 垂直同步信号仍然不能完全保证正常显示，比如说：
- 收到垂直同步信号时，如果 GPU 正在往缓冲区里写数据，CPU、GPU 绘制一帧的时间超过16ms，也就是一个 屏幕刷新周期 还没有准备完，这时候两个缓冲区不会发生复制。
- 当屏幕进入下一个刷新周期时，从
frame buffer中取出的是上一帧数据，即两个刷新周期显示的是同一帧数据，也就是掉帧（Jank）。
为此，引入了 三缓冲，但是仍然避免不了卡顿和延迟的现象，这里就不详细介绍了，可以自行查阅相关资料
显示器部分
一贞数据是"扫描枪"先横向扫描，然后再从下一行开头再扫描一行，一直向下扫描到最后一行，从而完成一贞图像
换一行有个短暂空白期，这就是水平消隐,简称 hblank（horizontal blank interval
完成一贞后从头开始，有个短暂的空白期，这就是垂直消隐,
垂直同步信号:当扫描点回到初始点，在准备扫描下一帧的时候，同时发出垂直同步信号，告诉显卡可以渲染下一帧了。这种情况下，显卡的渲染能力会受到屏幕刷新率 的制约。如果显示器刷新频率是60Hz，显卡帧率最多只会达到60。对于高帧率的显卡，开启垂直同步自然会制约其性能发挥。
