我开始循环
function gameLoop(){
update();
draw();
requestAnimFrame(gameLoop);
}
var requestAnimFrame = window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback) {
window.setTimeout(callback,1000 / 1);
};
>我无法调整帧速率.它总是真的很快为什么我不能将其更改为1帧.我想这样做只是为了测试目的.
>我每次都要清除画布吗？看起来好像没有清除它.
谢谢.
以下是完整代码的小提琴链接：
complete code
谢谢
解决方法
rAF被锁定到监视器的同步,通常为60 Hz,因此我们无法自己调整FPS(浏览器可能会在标签无效或电池时降低FPS).
此外,您正在尝试改变的是多面体填充的回退;也就是说：如果浏览器不支持rAF,那么它将改为使用setTimeout.然而,大多数浏览器现在支持rAF(甚至是未加前缀),所以setTimeout将永远不会被使用.
你可以做两件事情：
>使用setTimeout直接替换你的循环中的rAF(测试时)
例：
var FPS = 1;
function testLoop() {
... ordinary code
setTimeout(testLoop,1000/FPS);
}
>使用柜台的油门rAF：
例：
var framesToSkip = 60,counter = 0;
function loop() {
if (counter < framesToSkip) {
counter++;
requestAnimationFrame(loop);
return;
}
/// do regular stuff
counter = 0;
requestAnimationFrame(loop);
}
最有可能更好的方法来实现节流,但是我正在试图显示基本原理.这仍将全速运行,60 FPS,但您的代码将执行最少的操作,只有当计数器达到计数时,它将执行主代码.
你不需要每次清除画布,如果下一个画面将覆盖以前绘制的内容,或者如果你想保留它当然.如果需要,您还可以清除一部分进一步优化.
