Search the Community

Showing results for tags 'game loop'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Platform
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 3 results

  1. As PixiJS introduced Application class, I find there is a function start(): In PixiJS examples, the game loop always starts like: // Animate the rotation app.ticker.add(function() { anim.rotation += 0.01; }); But some examples use app.start(). So what is the best way for game loop? requestAnimateFrame? app.ticker.add? app.start?
  2. I've been trying to wrap my head around understanding the update and render functions. Here's my game loop: Update function runs at 25 fpsRender function runs as fast as it can (usually 50-60 FPS)For the sake of argument, lets pretend that I'm going to animate a box moving from left to right on the screen. Here's what's bugging me. If I put the code to change the xy into the update function, then in one second the box will have 25 position changes. Essentially, even though my render loop runs faster, the animation would appear to run at 25 FPS. I want to take advantage of my faster running rendering function for smoother animations. It would seem to me that I should initiate the move in the update function. Something like .moveTo(position), but then actually set the xy coordinates of the object in the render function. This is my first time writing a game loop so I'm not sure how other people do it, but it just seems weird to me to change the xy coordinates in the render function. I'd like to know how other people have approached this problem and what your solutions are. UPDATE: Or should the update function change the xy coordinates, and the render function just interpolate the change/difference in values?
  3. I'll start with an issue I'm having and after that I will pass to a more generic thought. I'm using this game loop structure, using requestAnimationFrame: 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); };})();gameloop=function(){ //Here I do my calculations and drawings //I do this in order to calculate FPS thisLoop=new Date; var fps=1000/(thisLoop-lastLoop); lastLoop=thisLoop; requestAnimFrame(gameloop); }It works fine both on Chrome and IE, at a steady 60 fps pace. But when running on Firefox, FPS counting goes over 60 (it sets around 65) and the gaming experience is a lot worse, not smooth at all because I suppose the screen might be dropping some frames. I read of setting a time-interval alongside the requestAnimFrame call but I don't know if it's the solution. Any thoughts? Having said that, a more broad question. MAKING GAME LOGIC FPS INDEPENDENT. This has been taking some of my time lately. I've tried a couple of methods to do that. In the first one, I use that fps data I'm getting to do the pertinent speed corrections every cycle with fresh data. Then I tried to do the same but using a mean value calculated over some cycles. I'm getting buggy results either way (what else!). Is this the correct approach? Which is the lowest FPS you handle in your games?