Performance problems with Chrome on IOS and Android

[darkraziel]

I've been working on a few projects using Phaser lately and I just came with this strange problem.

 

My game has some very heavy logic and lots of animations so I thought that this was what was slowing it down in Chrome, but I've been running some tests and I came up with some weird problems.

 

I have a blank state where I create 80 sprites at the same time and apply a tween to them (set to yoyo and infinite repeat) and it works just fine. But if I add a background image the game slows down a lot, going from an average of 55fps to 15fps.

 

I also noticed that if I create my sprites from an atlas performance drops a lot too.

 

The background image is a .PNG with 640x960 resolution. The sprites I create are 70x70 and also .PNG

 

Any ideas on what could be happening? any more info I should provide? Thanks in advance for any help I get.

 

edit: I should also add that this works perfectly on Safari, it's just a problem with Chrome and I'm using CANVAS by default instead of WEBGL.

[mariogarranz]

Hi darkraziel.

After the latest update of Chrome on Android I have experienced a huge loss of performance in HTML5 CANVAS rendering. I suspect there is some bug in the browser itself.

It would be interesting to see if anyone else is experiencing the same issues.

[darkraziel]

I just tested the same state in Chrome on Android and it works perfectly, at least for me it's just a problem with Chrome on IOS.

[mariogarranz]

Which Android Chrome version?

 

For me it's failing in 41.0.2272.94. Games that previously ran fine are now slowed down really hard, gone from 50fps down to 1-2.

[mariogarranz]

OK I can confirm it happened in 2 devices.


Games ran fine in my smartphone, Google Android version 40. Updated to 41.0.2272.94 and games are running like crap now. There must be some bug with this version, maybe you can check if that's the version you're using in iOS.

[darkraziel]

I'm currently using 41.0.2272.94 on Android without problems. It's 41.0.2272.94 on IOS that lags a lot with some specific objects.

[darkraziel]

After a lot of testing I found out that real problem isn't the background image. For some reason if I create any object (sprite, bitmapText) that takes textures from an Atlas, performance drops from 60fps to 5fps.

 

I'm not really sure if this is a bug with Chrome's latest version so I'll just have to continue this project without taking Chrome+IOS into consideration for performance testing.

 

examples:

 

This makes fps drop to 5:

this.game.add.sprite(100,100,"ui_atlas_gameplay","block1.png");

This works perfectly:

this.game.add.sprite(100,100,"block1.png");

[STuFF]

FYI chrome on IOS and chrome in android have NOTHING in commun, except the UI. On IOS, chrome is just à webview using and old version of safari, so we can't compare.

[darkraziel]

It seems that the last update to Chrome on Android broke something. All my projects run horribly in Chrome since the last update. Anyone else got this problem?

[traiq11alone]

Why you use chrome for your project? I think all games use Phaser should run by Phonegap or Cocoonjs

[Henryk]

I have the 41.0.2272.96 installed on a tablet and my game runs slow. Even in the native browser and all other browser the game runs otherwise well... 

 

How did you solve this?

[mariogarranz]

It's a Chrome bug. I already opened an issue at the Chromium project one week ago.

It seems that it may be related to the use of big textures. They have moved it from Unconfirmed to Available, so it seems they are aware of the bug but not working on it yet.

There's also a bug affecting WebGL on many devices with Android 4.4... a bad time for HTML5 games under Android Chrome.