html拖拽如何避免卡顿,分析页面显示，教你如何避免卡顿

1. 屏幕显示图像的原理

CRT 显示原理，准备进行扫描时，显示器会发出一个水平同步信号(horizonal synchronization)，简称 HSync。而当一帧画面绘制完成后，电子枪回复到原位，准备画下一帧前，显示器会发出一个垂直同步信号(vertical synchronization)，简称 VSync。显示器通常以固定频率进行刷新，这个刷新率就是 VSync 信号产生的频率。

通常来说，计算机系统中 CPU、GPU、显示器是以上面这种方式协同工作的。CPU 计算好显示内容提交到 GPU，GPU 渲染完成后将渲染结果放入帧缓冲区，随后视频控制器会按照 VSync 信号逐行读取帧缓冲区的数据，经过可能的数模转换传递给显示器显示。

1.1 水平同步信号：HSync

在简单的情况下，帧缓冲区只有一个，帧数据的读取和刷新都会有比较大的效率问题，为了解决效率问题，显示系统通常会引入两个缓冲区，即双缓冲机制。

在这种情况下，GPU 会预先渲染好一帧放入一个缓冲区内，让视频控制器读取，当下一帧渲染好后，GPU 会直接把视频控制器的指针指向第二个缓冲器。如此一来效率会有很大的提升。

1.2 垂直同步信号：VSync

双缓冲虽然能解决效率问题，但会引入一个新的问题。当视频控制器还未读取完成时，即屏幕内容刚显示一半时ÿ