webGL performance issues on android

Hi all

My current project is a simple mobile game: The project size is 720*1280, D/L size is less than 10MB and memory usage (from C2 bar) is less than 35Mb.

Since my project only contains one main animation and up to 20 tiny moving objects I did not expect any performance issues, but unfortunately such issues came up from square one, as I was getting significant fps drops.

At first, my game was using webGL with setColor effect. After testing every possible bit of my project without any improvement, I ended up converting all colored animation to bmp and disabling webGL altogether.

Only after disabling webGL the performance issue and the terrible slowdowns were resolved. This is quite a shame since the proper practice for my game would be to color objects with webGL (as may add unlimited number of colors) and not with multiple sets of bmps.

I was sure that webGL renderer is more efficient than the canvas2d renderer. isn't it so? Ashley can you please clarify?

canvas2d apk https://dl.dropboxusercontent.com/u/8918895/Froogies_1.1.4%20PG.20150118145613.apk

webGL apk https://dl.dropboxusercontent.com/u/8918895/Froogies_2.webgl.20150118170429.apk

(Sorry, I can't post the caps since I don't own the rights)

Along the process I also found out that I'm getting better performance when I use the PhoneGap exporter and not the Android one. Why does Scirra recommend on exporting to xdk via the android exporter and not via PG?

My understanding is that WebGL effects can be tricky on mobile because some mobile GPU's have odd architectures whose shortcomings can cause effects to fail entirely.

For example, on my android phone, the noise effect fails due to the way my Adreno GPU handles the sin() operation used to generate the noise effect, as per this article:

http://byteblacksmith.com/improvements- ... gl-es-2-0/

I know I've also heard of seemingly cheap effects grinding games to a halt on mobile because the particular GPU has trouble handling certain mathematical operations or data types in an efficient way.

Then again, you might be hitting a simple fillrate issue. Try a lower resolution and see if that clears things up.

In my case, while the noise function fails, most other effects work fine. I have an Adreno 305, and I continue to be amazed that I can pile on multiple webGL effects without tanking the FPS. Yet, I'm CPU limited: a couple dozen physics objects brings me sub-30fps framerates.

That's mobile: you have to figure out what the bottlenecks are, because they simply aren't consistent. It's best to try and build tests into your own game, enabling/disabling effects depending on what the FPS is doing.

I've been thinking lately that it should be possible to test effect compatibility on mobile by having startup tests where effects were applied to test sprites, sprites captured to a paster object or via the CanvasSnapshot function, then processed as an array to check if the effect is actually working.

So, see if a white sprite with the noise effect has mostly uniform pixel values (effect is failing), or if all the pixels seem different from each other (effect is working). For HSL, transform a small sprite, and check that the captured color is the same or close to what it should be. Etc...

Reproduce the problem in a new .capx that you can share, otherwise all I can do is speculate that WebGL shaders caused the performance problem, and turning off WebGL also turns off the shaders.

Many WebGL "Effects" that come default in C2 is to be avoided for mobile games, period. There's a few that are perfectly usable without major performance penalties but most of them, no go zone.

.Then again, you might be hitting a simple fillrate issue. Try a lower resolution and see if that clears things up.

The first thing I did was to reduce size (I started at 1080*1920). Hardly any impact. The fps drops were very notable. For some reason the dots horizontal movement in my game is very sensitive to such drops, even if only down to 40-45.

Reproduce the problem in a new .capx that you can share, otherwise all I can do is speculate that WebGL shaders caused the performance problem, and turning off WebGL also turns off the shaders.

No webGL effects are in-use any longer (and I was using only setColor at the first place). So I have to doubt your speculation, sorry. I will try to strip down the project, remove all nonofficial plugins, data sheets etc. and leave only the game's core animations. Hopefully I will have this by tomorrow and I'll send it over.

What about the PhoneGap exporter vs. Android exporter issue?

Many WebGL "Effects" that come default in C2 is to be avoided for mobile games, period. There's a few that are perfectly usable without major performance penalties but most of them, no go zone.

Again, No effects. Only webGL render on the recent version.

There is one last quirk that can make WebGL slower: on some platforms, updating a large Text object every tick can hit the framerate. Otherwise in pretty much every other case it's faster. So I'd guess that's what you're doing.

Ashley My txtDebug object updates every 0.3 sec and txtScore updates every 0.5 sec.

I'm about done making the simplified version, will send you soon.

Whenever you have a debug readout, use the spritefont object. Text object are too problematic on mobile, especially if you are trying to profile performance.

Whenever you have a debug readout, use the spritefont object. Text object are too problematic on mobile, especially if you are trying to profile performance.

That's good practice for debuging. I will use it. Thnxs TiAm

I shared the capx with Ashley.