我正在阅读关于javascript
优化的this article,并且有以下段落:
当屏幕上发生视觉变化时,您想要完成工作 在浏览器的正确时间,这是在开始时 帧。保证JavaScript运行的唯一方法 帧的开始是使用requestAnimationFrame。
而且:
框架或样本可以使用setTimeout或setInterval来进行可视化 像动画一样的变化,但问题在于 回调将在帧中的某个点运行,可能就在 结束,这往往会导致我们错过一个框架, 导致jank。
我想知道这里的框架是什么?它是指浏览器或设备以60 fps间隔放置的图片吗?如果是这样,那么callback run at some point in the frame
如何在段落中说明?
答案 0 :(得分:1)
是的,此上下文中的框架是屏幕的更新周期。
屏幕不会一次全部更新,而是在更新周期内从顶部更新到底部。在CRT显示器中,它是一个实际的光束扫过屏幕,照亮了荧光粉,在LCD屏幕上,它只是用新数据更新的像素,但它以相同的方式进行扫描。
如果屏幕更新与帧速率同步,动画将平滑流动,但如果间隔以不同的速率运行,则会对某些周期进行双倍更新或不进行更新,这些周期可视为抖动。如果更新发生在sweap通过屏幕的那一部分时,您甚至可以看到tearing。
更新动画的理想时间是vertical blanking interval。那是扫描完成一个更新周期并等待下一个更新周期。这就是requestAnimationFrame
的用途。