Jump to content

Recommended Posts

This is the whole purpose for using requestAnimationFrame, so... I fear there is no way to prevent that behavior :)


A suggestion:

use RAF only for your rendering output!
You can base your game logics on a javascript timer - that won't stop doing game calculations when you switch away from the tab.

Link to post
Share on other sites

What Chris said :) Use raf for rendering and a setTimeout for game logic. It's not ideal, but it's easy to check the tab visibility state, so you could actually use raf for everything until the tab loses visibility and then start a setTimeout going.


Alternatively you could pause the game and keep track of the time it paused, then when it resumes (i.e. they come back to the tab) you take a count of the time and make-up for that lost time in your game logic (i.e. advance that number of steps).

Link to post
Share on other sites

RAF is stopped when you switch tab but using the setTimeout is not a good solution either.


Because as mentioned in this link: http://stackoverflow.com/questions/6563859/minimum-setinterval-settimeout-delay-on-background-tabs/6563900#6563900


Background tabs have setTimeout and setInterval clamped to 1000ms to improve performance


You should pause your game to fix this issue :-(

Link to post
Share on other sites
by the mechanics of the game I can not pause. My game is like Tetris, between two people and in real time. If someone pauses the game, the other player would be complicated. Also there is some playing time probably would pause or would also be very different for the two players.


I have no choice to have something running in the background to make constant checks with the server and many other things
Link to post
Share on other sites

@leandro I encountered a similar issue with an online game and my solution was :

 1 - keep gamestate on the server (it's an online game right ?)

 2 - when the window lose focus stop the rendering but continue to update gamestate from the server

 3 - when the window get focus again clear the canvas and redraw the whole scene from the current server side gamestate.


the solution will maybe need some modifications in your rendering process but it works just fine :)

Link to post
Share on other sites

As suggested, split your whole game into two different loops. A render loop that only makes the draw calls and an update loop that executes the game logic and is triggered by a setInterval() finally.


You also should know that intervals are executed less precisely when the tab is inactive (to save resources), so you might want to calculate an interpolation load indicator that allows you to implement correct game logic, but has not to be something like precise physics simulations.

Link to post
Share on other sites
  • 3 months later...

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.

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.

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Create New...