Forums » Help » Ways to Optimize for Mobile Devices

I'm starting this thread to help collect ideas and methods to optimize any game for use on mobile devices. As I get farther into creating a game, I've realized the significant processing ability differences. My sloppily coded game ran perfect on a desktop but barely ran on a mobile until I did a few things. Note that I am a self-taught programmer and a lot of this is trial and error and I don't have the best understanding of how long different algorithms or functions may take. I'll start listing some things I've done to my first game so far:

-No sounds on mobile

-Spawn entities such as enemies just outside of screen so they don't always exist and take up resources before the player can be affected by them

-For entities such as platform movers or things that need to be updated during the entire level to determine their position,etc, I only perform their draw() function when they are just within view of the player. Update() is still calculating everything they need, they just aren't drawn unless the player can see them. I think this helps?

-If the entity is a particle, gib, lighting effect, or something else that doesn't impact gameplay and is eye candy, significantly limit the quantity spawned on a mobile

-Extend entities that share the same properties and functions as much as possible to simply cut down code.

-Get player or any other entity you may need to access from many other entities just once in the main game loop and reference to it as ig.game.player where you need it to cut down on the amount of times .getEntitiesByType needs to be used

-Optimize images for loading time - .png's are generally used since transparency is typically needed. .Png's can be converted from 24bit down to indexed colors and usually still look good as long as transparent gradients aren't used. - those start to look bad when color depth is lost. This helped a few of my .png's get from 88k to 22k and look the same to me. I used .jpg images when I had no transparency in that particular image.

That's what I've done so far, out of ideas!

There are two main things I've found out that help

1. Set the fps in the ig.main() lower by using the code

if( ig.ua.mobile ) {
    // All other mobile devices
    ig.main('#canvas', MyGame, 20, 160, 160, 2); //from 60 to 20

2. In the timer.js file, change the time scale accordingly. I found these to be the best scales

if( ig.ua.iPhone ) {ig.Timer.timeScale = 1.2;}
else{ig.Timer.timeScale = .8;} // basically all Android devices

There are also a bunch of great ideas in the doc Dominic made that can be found here

http://impactjs.com/documentation/impact-on-mobile-platforms

Yes Dominic's doc does point out that you should pre-render the background for mobiles, which loses background animation but speeds things up. Forgot about that one!

Does lowering the framerate help out? I thought the idea was to make the game easier to run so the framerate can stay as high as possible. Or does trying to run at a framerate of 60 fps on a mobile device hurt things? Good information about the time scale, I have noticed that my level timers, etc are running at about half their speed on a mobile device which is allowing me to beat the level in half the time then on a desktop PC...

I've been told that the frame rate shouldn't help it, but I believe I've seen an improvement in my games by lowering it. I may be imagining that though :p

I will try adjusting my target framerate and the timescale accordingly and report back on if I think it improves things.

It might also be worth noting this... Performance of Web Apps Saved to Home Screen Hampered in iOS 4.3