Игровой цикл requestAnimFrame (javascript / canvas)

Я борюсь с этим и не могу найти много ссылок, чтобы продолжить.

Я использую requestAnimFrame, который был написан Google:

requestAnimFrame = (function() {
  return window.requestAnimationFrame ||
     window.webkitRequestAnimationFrame ||
     window.mozRequestAnimationFrame ||
     window.oRequestAnimationFrame ||
     window.msRequestAnimationFrame ||
     function(/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
       window.setTimeout(callback, 1000/60);
     };
})();

у меня есть функция "init", которая настраивает мою игру. Затем это вызывает обновление, которое является игровым циклом, который вызывает рендеринг для рисования на холсте. Если вы игнорируете requestAnimFrame-каждая отдельная часть работает нормально. Как только я размещаю вызов requestAnimFrame, я либо получаю ошибку "слишком много рекурсии", либо просто FF крахи.

мой код в Update() выглядит следующим образом:

game.update = function()
{
    stats.update();
    fps.innerHTML = stats.getFPS();

// Render objects
game.render();
// Continue game loop
requestAnimFrame(game.update());
}

статистика.обновление просто обновляет счетчик FPS. Таким образом, вы можете видеть, что эта функция не делает много. Моя игра.функция рендеринга просто рисует нагрузку плиток на холст, и это отлично работает.

какие предложения?

спасибо!

Крис

1 ответов


нужно передать в функцию, а не результат вызова функции. Другими словами, измените это:

requestAnimFrame(game.update());

для этого:

requestAnimFrame(game.update);

кстати он сейчас пойдет в game.update, сделайте свое дело, а затем попробуйте оценить выражение:

requestAnimFrame(game.update())

чтобы оценить это, сначала необходимо оценить аргумент requestAnimFrame:

game.update()

это просто вызов функции обратно к себе, что приводит к бесконечной рекурсии до переполнения стека / слишком большой ошибки рекурсии. Он никогда не получает вызова requestAnimFrame потому что он всегда оценивает внутренний аргумент.