Improving PhaserJS Performance

[metalNumb]

Hey guys !!! 

So i have been making some cool progress with my game, and i have been testing it on multiple browsers and on my mobile phone browser (Chrome) and the results are crazy ! ! ! 

 

In Internet Explorer in windows 7, i get SOLID 60 FPS all the time (Shocking to me), but it has no sound.  ( WebAudio not supported yet ? )

In chrome i get 55~60 FPS ( Which is playable, but i am VERY sensitive to any little jitter so i feel it is kind of distracting ) and on mobile it is EXTREMELY slow and unplayable ( Around 5~20 FPS, not even consistent ) !!!

 

Why does it behave that way ?

Is there a way to improve performance ?

 

PS: Using PhaserJS version 2.2.1 

And i have a Samsung Ace 3 running android 4.2.2. Usually i don't play HTML5 games on it but some simple browser games run just fine.

 

You can test a VERY early prototype of what i am working on by going here.

 

http://pixos-metalnumb.c9.io/

 

Thanks people !!!

[valueerror]

you could do a lot of things to make it faster IMHO..

 

for example..  do not update text on every frame if nothing changes.. (funny thing.. text is expensive)

OR..  do not spawn new enemies all the time..  reuse them..  and/or use sprite batch

LIMIT the size of your game..   try the game with 800x600  it makes a huge difference to 1600x1200  .. for now your game scales with the window.. thats not a good idea .. on my tablet it would run in 1920x1080  that's a lot of pixels to process..

 

the samsung ace is not the fastest device out there and 4.2.2 is already old in 2015  --  the native browser sucks hard when it comes to performance so try to use chrome whenever possible to test the game on your mobile device or compile it with crosswalk to get better results

[metalNumb]

Thanks for the reply, will definitely try these. 

Could you please show me an example of how could i modify my code to be able to reuse sprites ?

 

EDIT: This would work if i am using normal sprites with no AI.

this.enemies.createMultiple(30, 'enemy');  

EDIT: Knowing that i use custom sprite objects, i have no idea how to do so. 

[Dennis]

You can set the classType of Phaser.Group to your custom sprite.

this.enemies.classType = CustomSprite;

[metalNumb]

 

You can set the classType of Phaser.Group to your custom sprite.

this.enemies.classType = CustomSprite;

 

Interesting...

Hmmm... but what arguments am i going to pass to this... ?

this.enemies.createMultiple();  

Thank you. 

[metalNumb]

Also i have increased the rate at which the spawnEnemy function is called to every 100ms and Internet Explorer had not even a hiccup of performance drop. 

( That also caused more than 30 enemies to be shown on the screen at once, with everything working super smooth ), Also in chrome it did not change much. 

 

In mobile it maybe the case causing the performance drop, but on PC, there must be something else causing the jitters on chrome. 

[valueerror]

in the current chrome there are known problems.. also addons cause jitter very often.. try chrome canary without addons or just let it go.. i could be wrong but it will probably solve it self..

[Dennis]

Just as usual. this.enemies.createMultiple(30, 'enemy');  The 'enemy' will be passed to your custom sprite constructor.

[metalNumb]

Thank you guys !