How to improve mobile Phaser performance?

[terencechow]

Hi All,

 

I have a game that's very similar to flappy bird. You tap to make the player go up and you release to go down. To make it visually appealing, I have 2 different types of background, a forest and a cave. In total it's about 3 images of cave and 3 images of forest. I set it so that the background moves from right to left, while the player only moves up and down when you tap. Visually this looks like you're flying through the forest, then the cave, then the forest, etc.

 

Obstacles also come from right to left and fly at you. 

 

That in a nutshell is my entire game and it works fine on desktop.

 

On mobile however, it stutters and feels slow. Collisions also sometimes lag the game a bit. If I remove the backgrounds, the game feels normal on mobile.

 

So I think the major problem is that I have an entire background image moving from right to left at all times.

 

I read somewhere that I could use 2 canvases, overlayed on top of each other. A foreground canvas which is mostly transparent except for the objects, and another canvas which is just the background. I feel like 2 canvases of Phaser games would be less performant, but I'm not sure. What I read said it would perform better, but that was based on a background that didn't move like my game does. I don't want to implement it if I find the performance gets worse or the performance gain is negligible.

 

I don't have text rendering. Everything is images. I load sprites offscreen. 

 

What can I do to improve performance based on the information I've provided?  Should I try the 2 canvases approach? What are some things I can try to significantly boost my performance? I'm willing to try anything at this point...

 

[MichaelD]

I'm struggling with a similar issue, game on Desktop runs at 60fps but on a new tablet with quad core it runs with 25fps Canvas and 40fps WebGL. I could live with 40FPS but unfortunately the Android stock browser doesn't display Sprites it just shows a black box.

 

If we could get some opinions or test cases about mobile it would be great.

[valueerror]

@terencechow:  care to share an example of the game?   it doesn't look like a game that should have performance problems on mobile..   (depending on the device of course)  

 

on a new quadcore tablet almost every game should run smooth..  i dare to say that there is definitely something you can do/change in your code to make it work  

[MichaelD]

You can view an example here http://www.netgfx.com/trunk/jaws

 

This game runs smoothly on my PC (naturally). But cannot get over 25 FPS on a lenovo tablet or my HTC One. 

 

If someone care to run some test please let me know how it goes. I'm running some very simple conditions on the "Update" but nothing way too heavy, at least that's what I think. And only 3 looped timers.

[terencechow]

I have a lot of code but in a nutshell here is what my update function is doing:
(this is pseudo code)

if (this.player.is_alive()){    this.increase_dificulty(); // determines the speed that enemies and the backgroundmove    this.check_collisions(); // checks collisions    this.generate_powerups(); // checks an array of sprites and the number alive and if less than a certain number it spawns powerups. (i.e basically always have 1-2 powerups show up every X seconds    this.generate_enemies_and_obstacles(); // checks an array of sprites and the number alive. if less than a certain number it spawns enemies and obstacles offscreen. ie have ~5 enemies / obstacles show up every X seconds    this.background.update(velocity) // moves the background to simulate the movement    this.powerups.update(velocity) // moves the powerups from right to left to simulate that you are flying closer to them    this.obstacles.update(velocity) // moves obstacles from right to left to simulate that the obstacles are coming at the player    this.update_score_text() // updates the score each second and displays it on screen. this is a bitmapText }

That's pretty much it.  Do you see anything here that could potentially speed up the game?

[MichaelD]

I would assume that using a looped timer for the spawn would be faster. But since I'm doing that and still not getting great performance maybe this isn't the way to go.

 

I would love to know what is the most efficient way to spawn items, and/or check various things (not collisions)