在学习小程序中的小飞机的小游戏中飞机的飞行和背景替换都是循环的，本来我以为时用的循环机制进行循环执行后来发现并不是用的是window.requestAnimationFrame进行循环刷新。因此我对requestAnimationFrame进行了一番查询：
window.requestAnimationFrame() 方法告诉浏览器您希望执行动画并请求浏览器在下一次重绘之前调用指定的函数来更新动画。该方法使用一个回调函数作为参数，这个回调函数会在浏览器重绘之前调用。
其实简单来说就是说当浏览器进行重绘时会先执行这个方法的
那为什么浏览器会进行重绘昵？
当你对着电脑屏幕什么也不做的情况下，显示器也会以每秒60次的频率正在不断的更新屏幕上的图像。为什么你感觉不到这个变化？ 那是因为人的眼睛有视觉停留效应，即前一副画面留在大脑的印象还没消失，紧接着后一副画面就跟上来了，这中间只间隔了16.7ms(1000/60≈16.7)， 所以会让你误以为屏幕上的图像是静止不动的。而屏幕给你的这种感觉是对的
其实js中的setTimeout方法也可以同样做到这个效果，但是用requestAnimationFrame 的好处就在于它是由系统来决定回调函数执行时机（也就是刷新的速率）从而保证它的回调函数在每次界面刷新的时候都会执行一次不会出现丢帧的情况
网友评论