Search the Community

Showing results for tags 'FPS'.

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
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • 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 124 results

  1. Hi all, I have picked back up a project I started a while back and have run into some issues. I decided to upgrade from 2.2.2 to 2.4.4 assuming that all of the effort and improvements will be a benefit. I learned that the scaling API had changed a little, so I fixed my code to use the appropriate methods, discarding the deprecated ones. That eliminated the exceptions I was seeing. Unfortunately, though the game now runs, I have found that my FPS has dropped from around 55-60 to 5-15. I can toggle between these two versions of Phaser 2 and instantly see the difference in FPS. Everything else about the game looks the same and nothing is being reported in the logs. The only clue I have is that the drop in FPS occurs when the tilemap is scrolling. My game uses the following APIs/functionality: Tilemaps (made in Tiled), collisions set using, 4);Audio (mp3)Tried out both Canvas and WebGL rendering (no perceptible difference)Arcade physicsI'd greatly appreciate any tips/gotchas I should be watching for. Is there some flag I should be setting to correct the scolling problems? Thanks!
  2. Hello, not getting it out of the doc. when I set: game.time.advancedTiming = true; game.time.desiredFps = 50; My Game runs with 50 FPS (instead of 60). That's what I intended to do. Just because I do not need more FPS. So does this REALLY affect performance? When doing much calculation and drawing, is lagging reduced by 50FPS (desired) then 60? kind regards
  3. Hello friends! I don't understand how to use engine.beginFrame(). It says in the documentation that it should measure the Frames Per Second but i don't understand how it works. If anyone could show me a example that would have been awesome. I have tried to measure the FPS by my self and it looks something like this. var lastCalledTime;var fps;var stop = 0; var renderLoop = function () { // Start new frame if(!lastCalledTime) { lastCalledTime = new Date().getTime(); fps = 0; BABYLON.Tools.QueueNewFrame(renderLoop); return; } delta = (new Date().getTime() - lastCalledTime)/1000; lastCalledTime = new Date().getTime(); fps = 1/delta; // a stop variable since it hard to se the fps when it's displayed 60 times per //second, if(stop == 30){ // a div element to display the fps fpsDiv.innerHTML = parseInt(fps); stop = 0; } engine.beginFrame(); scene.render(); // Present engine.endFrame(); // Register new frame BABYLON.Tools.QueueNewFrame(renderLoop); stop++;};It shows a frame rate between 60 and 0 but it's usually quite low around 16 FPS. I have a piece of shit computer so that doesn't surprise me, but i want to be sure that i really measure the fps. Thanks!
  4. I was looking for a good bunnymark example in phaser, but couldn't find a decent one, so I wrote one myself: There are two versions: Basic: all sprites have same scale, angle, rotation Custom: all sprites have random scale, angle, rotation Two versions have the same code, but just different options set. - Click on the game to create bunnies. (Well, technically phaser-dudes) - There are options in preload to customize it. - All sprites are respawned from their original spawn point after they slow down. It was good practice for me, but now I don't know what to do with it, so I'm just putting this here, in case anyone has a use for it. Also all feedback is welcome.
  5. I want to limit the rotation of freeCamera up and down. Because if the FPS shooter used cars or tank then when you turn it down, it buries itself. And the tank can't be at 90 degrees to the sky or the ground.
  6. Hi, I'm trying to replicate the camera movement from a typical FPS game. I want the camera to follow the player's mouse, without the need to click at all. Here's what I've got so far: var lastMove = 0;oldx = 0,oldy = 0,mousemovemethod = function (e) { if( - lastMove > 40) { if (e.pageX < oldx) { camera.rotation.y -= .1; } else if (e.pageX > oldx) { camera.rotation.y += .1; } if (e.pageY < oldy) { camera.rotation.x -= .1; } else if (e.pageY > oldy) { camera.rotation.x += .1; } oldx = e.pageX; oldy = e.pageY; lastMove =; }}document.addEventListener('mousemove', mousemovemethod);The camera movement is rough and intermittent. I'd like it to be smooth with a bit of easing. Here's a link to the full code: My question: How can I smooth out the rotation code above, or is there a better way? Solution: camera.cameraRotation.ycamera.cameraRotation.x cameraRotation provides the smooth transition I was looking for.
  7. In my game if you touch the screen and then move the pointer, the fps drops from 60fps to 35-40fps. ( tested in galaxy s3 mini ) And has nothing to do with my code, if I try this example: The highest fps I get it's 50 without doing anything ( CANVAS mode ) Moving 1 pointer : 30-35fps Moving 2 pointers: 25-30fps. Pointers are very usefull, but they seem to be slooow. Is there anyway to optimize this? or at least replace the pointers with something else? I have a virtual gamepad to move a spaceship and a button to shoot. Thanks
  8. Hello everyone! I was looking for the answers across forum topics but without success. I am just wondering why when I am viewing any babylon.js app (even as simple as Basic Scene on it's frame rate always not higher than 40 frames per second. I was expecting it to be 60 fps... Is there some reason for this or I am missing something?
  9. I'm seeing a huge performance drop on mobile browsers whenever I put a skybox on my scene, even if scene is very simple. This can be seen even on BabylonJS site - Lens flares demo Can someone confirm this (i hope its not just me...) ? ThreeJS examples work perfectly on my devices, this one for example
  10. iPad2 (& Safari) seem to drop my game's frame rate from 60ps to 30fps max. 30fps is still ok, so I tried to resolve the move/speed issue by using delta time between frames, at the beginning of every update routine: var deltaTime = game.time.elapsed; ...and applying deltaTime to x/y movements. This just caused image & sprite movements to double their speed in iPad. Game tweens seemed to suffer the same problem. However P2 physics seem to work ok in all devices. After searching and testing, I found a solution for delta time: var deltaTime = game.time.physicsElapsed; And for tweens, setting this parameter did the trick: Tween.frameBased = true; ...although duration seem to be still in milliseconds, not in frames, as the documentation states. I'm wondering where Phaser.Time.elapsed is needed, when Phaser.Time.physicsElapsed does the trick so much better?!
  11. Preface We're a small development team of four that is working on an educational project for the children with special educational needs such as those with autism, hyperactivity or delayed mental development. The project consists of two main parts. Administrative part which covers management and functionality of student profiles, educational center profiles, teacher profiles, parent profiles, game administration in which teachers can replace characters, scale them and change different options based on the game, thus creating new game versions of the same idea. And second, the actual games which are developed in Phaser. The games themselves are designed by a team of seven psychologists and teachers that we are working with, they are those who decide how the game will look like, approve designs and brainstorm ideas based on their knowledge about working with children with special educational needs. From this come several restrictions or requirements: - The game must be filling the viewing area of the browser when maximized; - The game must be scalable so it can fit different screen sizes; - Mobile or tablet support is not considered nor required, but it it comes for free it's a plus; - Animations are complex and must be smooth; Due to the last requirement, for the animations to be smooth, the sprites are usually large and consist of many frames. Our designer have repeated some of the frames that can be removed, but this is not the issue at the moment. Here are some of the sprites we are working with in our first experiment: - Moving caterpillar - Magician appearing - Magician pointing NOTE: I know the sprites can be improved additionally, actually those are parsed through TinyPNG unlike the original ones and some repeating frames can be removed. The Problem And here's a basic example to illustrate our problem, I just placed some of the sprites on the screen. The fps drop happens even if I don't attempt to animate all of them, so I doubt this is a real performance issue: - A few sprite objects, animations are running smoothly as they should be; - Adding additional sprite object in the middle, it ruins everything - (3000x2700 size, High-end CPU is hogging at 40-60%, fps drops at 3-5) I've noticed that if I artificially change the size of the signs object, the stutter disappears. Here I make the sprite huge with simple resize: - Resized middle object to 5100 x 4590, no stutter. IMPORTANT: Be sure to close the stuttering example if you open several tabs because it affects everything. We have absolutely no idea why this happens, from what I see it's some problem with the sprite layout and sizing, I've read somewhere that it's good practice to keep the dimensions on the power of 2 but those aren't. We are considering switching to Atlas but need to figure out if this is going to be a problem and why is it a problem to begin with. We've asked for advice some colleagues in another company that are dealing with games as well and they've given us some very good advice regarding the repeatable frames and suggesting that the sprite size can be reduced dramatically. Additionally they've stated that the sprites are huge and this is causing the performance issue, however I do not agree because the above examples clearly illustrates that even if I increase the image size artificially three times it can still be smooth.
  12. How to disable fixed FPS in version 2.4.3? is it possible? Or, can disable tunneling in early state play? Low FPS at begin of my game (after version 2.2.0). Solution to problem in i could not found. Until I see that the only way out is to use 2.1.3.
  13. fps is not regularly working in chrome. I expected fps should be 60 but seconds later fps drops from 60 to 40 then it works normally, again and again but fps works normally in firefox.
  14. I have a game that is only 11mb right now, but after finally wrapping the game with CocoonJS, I noticed the the game would go from 60fps to <15fps in about 10 seconds. I think the only way the game could be slowing down is having something like an infinite array; I have an array that I push to to get the direction of a swipe, then I set that array to an empty array to prevent an infinite array.
  15. Hi everyone, I'm noticing refresh freezes when showing items (loaded, but with visible set to false). With freeze I mean that although normally the game works with 60fps, when showing new item (loaded but not visible) it takes 300ms to call another render. My loop is simple and looks like the following: function render() { update(); renderer.render( container ); // render stage requestAnimationFrame( render );}I logged the render function to output time from the previous render and it returns 300ms when the problematic event occurs. I tested every single line and it came down to a single line: sprite.visible = true;This sprite is made visible through keyboard event (when space is pressed) and it is the single line of code being called. The texture for the sprite is loaded at the beginning by using PIXI.loader with event complete that instantiates the sprite object, closes the loading screen and shows the stage (container object, I'm using pixi 3.0.6). As follows: PIXI.loader.add("mysprite","sprite.jpg").once('complete',function(){ sprite = new PIXI.Sprite( loader.resources.mysprite.texture ); sprite.position.set( 100, 100 ); container.addChild( sprite );}).load();So why does it take so much time to render the object, it is loaded just not visible. Is there a workaround, like preloading (am I not doing that already?), I mean, this 300ms freeze is just too noticable. One more thing. It happens only on the first time the sprite is shown, later everything runs smoothly. I am testing with Chrome 43 (I tested the example with Chrome 43, IE11 doesn't seem to have a delay), same thing happens on Android after compiling with CocoonJS. Thanks.
  16. Hello, I want to create a FPS Camera but i also want to be able to jump. The FPS camera is really not the problem: My Problem now is to add the jumping! How can i implement a real jump? The collision should pretend me from jumping through other objects.
  17. Hello again, I'm opening a new thread for this. Well I tried to change the fps in the tab of the animation editor and they don't get applied. Not in export neither after page reload. Second thing is sort a bit strange. I animated a pig geting smashed into peieces by a hammer. Now within the editor all is timed up well. After export and then playing back via code, it looks odd. I have the feeling all animated elements start at the same time. Made a test example and indeed they play back at the same time: I hope this gets fixed quick or at least a hint, how I can achieve it otherwise. Thanx in advance, Henryk
  18. Hey everyone! First post here, so bare with me a bit. I have started my first Phaser game and I've got the core of the game put together now. However, I have a problem where I'm experiencing some pretty serious FPS problems. In my game, a character moves around the map and the tiles they walk onto change colours. Each time a new colour is drawn the game lags. I use a basic TileMap with only 1 layer that is in JSON format. I use the TileMap.PutTile() function to change the colour of each tile. The image used for this tile is a very simple <1KB png image which is basically just a single colour. I wouldn't expect that drawing a single tile would cause such lag. I'm certain that the "putTile" line is the problem as if I remove it then there isn't a stitch of lag. // Pre-loading the tilemap and the tile game.load.tilemap('map', 'assets/maps/TileMap5.json', null, Phaser.Tilemap.TILED_JSON); game.load.image('tile-danger-zone', 'assets/images/tiles/tile-danger-zone.png', true); // Create map layermap = game.add.tilemap('map');mapLayer = map.createLayer('Tile Layer 1'); // Fill the tile -- once per player movementmap.putTile(DANGER_ZONE_ID, x, y, mapLayer); <-- this lags a fair bit (ie. 60fps -> 20fps) Am I doing something wrong in my practice here? Is there a more lightweight of doing this that wouldn't cause this lag? ^ Given this example, the putTile method shouldn't be a problem at all. Weird!?! The game can be found here if you want to see the problem: Thanks for any help! Let me know if you need any further information.
  19. Hi,I am from Taiwan,Pandjs is so good. My English is poor but I have a problem Now i making a game with panda and cocoonjs My problem is the particle let FPS drop or not? Becase I use lot of particles. In Chrome or FireFox,my game fps is usually 60. But when i use cocoonjs,FPS drop to usually 30~40.(My mobile is Sony Xperia Z1) When particle more in stage,FPS drop more!! Is it normal?
  20. I'm porting a Flash/AIR project to Phaser, and everything is going pretty smoothly so far, but I hit a really odd performance issue which I'm hoping someone can explain to me. When using a forEach loop on a phaser Group (called desksGroup) which only has 9 items in it, I get ~40fps on mobile. But if I get rid of that forEach loop, and instead put the code into the built-in update() function of each of the 9 sprites within the group, FPS drops to ~4. Here is the game loop with a forEach going through a group of sprites (desksGroup): GameState.prototype.update = function() { // kill any pencils that hit a wall game.physics.arcade.overlap(layerMap, pencilsGroup, pencilHitWall); // TODO: subclass "Sprite" so that these update functions call themselves desksGroup.forEach(function(desk) { clientsGroup.forEach(function(theClient) { // get closest client if (!desk.currentTarget || desk.currentTarget && game.physics.arcade.distanceBetween(desk, theClient) < game.physics.arcade.distanceBetween(desk, desk.currentTarget)) desk.currentTarget = theClient; // other ideas for targeting: least health, most health, slowest, fastest }); if (desk.currentTarget && > 0 && game.physics.arcade.distanceBetween(desk, desk.currentTarget) < desk.range) { if ( > desk.nextFire) { desk.nextFire = + desk.fireRate; var pencil = pencilsGroup.getFirstExists(false); pencil.reset(desk.x, desk.y); pencil.lifespan = desk.fireLife; pencil.rotation = game.physics.arcade.moveToObject(pencil, desk.currentTarget, desk.fireSpeed); } } }); game.physics.arcade.overlap(clientsGroup, pencilsGroup, pencilHitClient); if(defaults.showHealth) { clientsGroup.forEach(function(client) { game.debug.geom(new Phaser.Rectangle(client.x, client.y - 16, Math.max(0, tilemap.tileWidth * ( /, 7), '#00ff00', true); }); }}And here is a slightly modified version, with that forEach removed: GameState.prototype.update = function() { // kill any pencils that hit a wall game.physics.arcade.overlap(layerMap, pencilsGroup, pencilHitWall); game.physics.arcade.overlap(clientsGroup, pencilsGroup, pencilHitClient); if(defaults.showHealth) { clientsGroup.forEach(function(client) { game.debug.geom(new Phaser.Rectangle(client.x, client.y - 16, Math.max(0, tilemap.tileWidth * ( /, 7), '#00ff00', true); }); }}With the desk update functions moved to this: var deskUpdate = function() { var desk = this; clientsGroup.forEachAlive(function(theClient) { // get closest client if (!desk.currentTarget || desk.currentTarget && game.physics.arcade.distanceBetween(desk, theClient) < game.physics.arcade.distanceBetween(desk, desk.currentTarget)) desk.currentTarget = theClient; // other ideas for targeting: least health, most health, slowest, fastest }); if (desk.currentTarget && > 0 && game.physics.arcade.distanceBetween(desk, desk.currentTarget) < desk.range) { if ( > desk.nextFire) { desk.nextFire = + desk.fireRate; var pencil = pencilsGroup.getFirstExists(false); pencil.reset(desk.x, desk.y); pencil.lifespan = desk.fireLife; pencil.rotation = game.physics.arcade.moveToObject(pencil, desk.currentTarget, desk.fireSpeed); } }}As you can see, the only difference is that I've removed the desksGroup.forEach() code block, and created an updateDesk function. Elsewhere in the code, where I instantiate the "desk" Sprites, I have the following line: desk.update = deskUpdate;I was thinking that by adding the deskUpdate function to each desk Sprite, it would save some overhead (since the .update() gets called automatically, instead of my explicitly looping through the group via forEach). However, when I use this deskUpdate function, my FPS on mobile drops from ~40fps to ~4fps. I also tried using an regular function declaration (function deskUpdate() {...}), and had the same performance loss.
  21. Hi Guys, I'm drawing an isometric grid with mouse-over hit area detection over each tile. It works but the frame rates are awful. Any idea what is bringing the frame-rates down so much? Surely, webGL is capable of attaining better FPS than this? What am I doing that is particularly taxing for the browser? There are no moving sprites (only diamond-shapes PIXI.Graphics) drawn to the screen. ps. I can get about 45,000 moving sprites on bunnymark at 30fps. Cheers, Jordan
  22. Hi, I'm struggling to get phaser to display the fps of the game. Error is: Cannot read property 'game' of undefined. I've read around a bit: and looked at the manual but I've hit a bit of a wall. I've got a feeling I'm probably missing something incredibly obvious... Using latest version of typescript and running in latest version of node-webkit. Code: /// <reference path="../definitions/phaser.d.ts" />class SimpleGame { game: Phaser.Game; fpsText: Phaser.Text; fps: number; timer: Phaser.Timer; constructor() { = new Phaser.Game(800, 600, Phaser.AUTO, 'content', { preload: this.preload, create: this.create, update: this.update(), render: this.render() }); } preload() { console.log("preloaded");'logo', 'assets/logo.png'); this.timer =; = true; } create() { console.log("created"); this.fpsText =, 16, 'fps: 0', { fontSize: '32px', fill: '#567' }); } update(){ } render(){ this.fpsText.text = 'fps: : ' +; }}window.onload = () => { var game = new SimpleGame();};Thanks for reading
  23. I'd like to just unlock the framerate if possible. If that's not possible. How can I call update on my stage and all my objects extra times per frame? I want fastforward to go very fast.
  24. Hello, The weirdest bug/issue just came up, I had a very light game (in terms of updates/actions, etc) and I was getting no more than 25 FPS on mobile devices (quad core tablet, dual core mobile phone android) When I was trying to figure out what was wrong I deleted one line from my .css file and suddenly the game runs with 55-60 FPS as intended. I reversed the changed line and again fps dropped to 25-27. I simply had canvas { border: 5px solid white;}Does anyone know why this happens? And moreover if any more css properties affect game performance. Thanks guys, I hope we can clarify and find the reason behind this.
  25. Hey everyone, first of all - thanks for PhaserJS. It's awesome and I love working with it. I'm working on a game called rocklegend - which is available here: - currently to see the game you have to login. I created a user account for you guys to test: Username and password: phaserjs I optimized a few things such as the notes (only drawing a fixed amount of notes at the same time, so I have 20 notes and reuse these objects)... But currently I can't find out why the game still feels laggy sometimes. The notes are positioned within a Group Container and the containers y position ist updated in each update call according to the playback position of the played song. I'm not sure if the problem is the sound library - I'm using SoundJS for the sounds - should i try lowlag maybe, or if it's my code that's not optimal... You can find the concatenated version of the JS at Any advice, hints, ideas are greatly appreciated! Also, if you just have tips how I could try to debug this problem, that'd be great