Jump to content

Fixed time-step game loop understanding


zigazak
 Share

Recommended Posts

Hi guys, my first post on these forums, how exciting  :P

 

A little background of myself - I am a web developer by profession, and most of my experience is within the tradition lamp stack / php development, however, I've seen the light! Although I've always know enough javascript to get by, and understand most simple concepts, i've never really truly understood the language. I've fallen head over heels in love with the language and much prefer 'the javascript way' of prototypal inheritance, synchronous programming, dynamic typing, etc. I've recently been trying to broaden my low level javaScript knowledge, and I love games, so most most of my tinkering has been within the game development realm.

 

ANYWAYS, enough of the life story, basically what i've done is tried to fully grasp the idea of a game loop written in javascript - I was hoping to get as much feedback / suggestion / constructive criticism as I could. So without further adue, I present to you, my understanding of a fixed time-step game loop written in javascript.

var Game = function() {    // our fixed time-step // 60 FPS // or 16.667 ms per frame    this.timeStep = 1000 / 60;    // used to store the relative 'execution' time of the previous frame    this.lastFrameTime = 0;    // used to store the time taken to process the previous frame    this.deltaTime = 0;    // used to store update calls within our 'time-step' simulation    this.updateCalls = 0;    // the maximum number of update calls we'll allow before we intervene    this.maxUpdateCalls = 240;    // start our loop - bind our local execution context (the game object)    requestAnimationFrame(this.mainLoop.bind(this));}// timestamp: indicates the current time when callbacks queued by// requestAnimationFrame begin to fire. think of it as "startFrameTime"// this is automatically passed by the requestAnimationFrame functionGame.prototype.mainLoop = function(timestamp) {    // this function is called when our update calls exceed the maximum    // update call limit, either our update logic has taken too long to    // process, resulting in a very large deltaTime, or the window has    // lost focus.    function panic() {        console.log('WARNING :: loop panic!');        this.deltaTime = 0; // discard the unsimulated time        // snap the player to the authoritave state (from the server)    }    // the accumulation of the remaining delta time from the last    // update + the time taken to process the previous frame (the delta time)    this.deltaTime += timestamp - this.lastFrameTime;    // set the last frame time to the current timestamp    // this is confusing, we are basically setting our 'last frame time'    // for the next frame    this.lastFrameTime = timestamp;    // reset our update call counter    this.updateCalls = 0;    // simulate the total elapsed time in fixed-size chucks while the time taken to    // render the frame is greater or equal to the desired timestep (the amount of    // time we want to render a frame (16.667ms))    // If the time that has passed since the last frame is less than the    // fixed simulation time, we just won't run an update() until the the next frame    // the remaining time left over is added to the next frame's delta time    while (this.deltaTime >= this.timeStep) {        // !!!!! update  with our fixed time step (1000/60 === 16.667) !!!!! //        // decrease our desired time step time from the accumulated delta        // until it is less than 16.667ms        this.deltaTime -= this.timeStep;        // are we in a spiral of death        if (++this.updateCalls >= this.maxUpdateCalls) {            panic();            break;        }    }    // !!!! draw our game objects !!!! //    requestAnimationFrame(this.mainLoop.bind(this));}

I've also read about FPS throttling, but I don't really understand the concept. I'm under the impression that if you have a fixed time-step and 'simulate' updates within your game loop, you'll never breach the time-steps resulting FPS, in this case 60 frames per second. Am I not understanding something correctly?

 

 

Link to comment
Share on other sites

It's bad practice to limit your game under 200 ish frames per second. 60 Will not do. 120 is pushing it and thus far 200 is about the right max rendering speed. Separate animation and rendering from eachother.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...