Question

我有以下代码：

    var gameStateRender = function (game) {

    var t = new Date();
    /* time passed since last frame */
    game.timePassed = t.getTime() - game.timeFrameStart;
    /* time when frame starts */
    game.timeFrameStart = t.getTime();
    /* time passed total */
    game.timeTotal += game.timePassed;
    game.update();
    game.draw();
    };

    /* set the default game-state */
    var gameState = gameStateRender;

我以60 fps使用requestAnimFrame和后备（setTimeout）。

    window.requestAnimFrame = (function () {

    return  window.requestAnimationFrame    || 
    window.webkitRequestAnimationFrame  || 
    window.mozRequestAnimationFrame     || 
    window.oRequestAnimationFrame       || 
    window.msRequestAnimationFrame      || 
    function(callback) {

    window.setTimeout(callback, 1000 / game.fps);
    };
    })();

    (function gameloop () {

    requestAnimFrame(gameloop);
    gameState(game);

    })();

游戏在FF，IE9中运行平稳，帧速率恒定在~60 fps。

在Chrome中游戏也有~60 fps，但口吃。一些事实：

当我在chrome中移动鼠标时，整个动画是平滑的，当我停止移动鼠标时，动画开始变得口吃。游戏总是有~60 fps（我移动鼠标时没有）。

当我使用console.log(...)时，游戏运行顺畅，没有打印到控制台的东西，游戏再次出现口吃。（???）

var gameStateRender = function (game) {

var t = new Date();
/* time passed since last frame */
game.timePassed = t.getTime() - game.timeFrameStart;
/* time when frame starts */
game.timeFrameStart = t.getTime();
/* time passed total */
game.timeTotal += game.timePassed;

console.log(game.timeTotal);

game.update();
game.draw();
};

当我运行上面的代码时，动画很流畅。事实上，游戏的帧速率始终为~60（每帧16ms），我已经验证过了。

之前有没有人有这种（奇怪的）行为？听起来很奇怪。

使用画布的chrome（使用游戏循环）中的奇怪行为

0 个答案: