Phaser 3.50.0+ GPU issue on iPad Mini 4

[jfred1979]

Version

• Phaser Version: 3.24.1 and 3.50.0 (see description)

• Operating system: iOS 15.4

• Browser: Safari

Description

The jump from Phaser 3.24.1 to 3.50.0 seems to have introduced some problems with older iPads. The device I've been testing on is an iPad Mini 4. It currently has iOS 15.4 installed on it. I am not 100% sure, but the iOS 15 update may also have something to do with this issue. You can see in Apple's release notes that WebGL runs on top of Metal as of that release (although I'm not clear on whether its ALL WebGL calls or just WebGL 2.0 stuff): https://developer.apple.com/documentation/safari-release-notes/safari-15-release-notes

Either way, a number of games I have worked on now have what appear to be GPU related issues when running with the WebGL renderer. The canvas may render a few frames but then blinks and goes black, sometimes partially rendering a little bit of the screen, eventually halting execution of the page (without any errors being logged). The same code runs fine when using Phaser 3.24.1. The jump to 3.50.0 appears to have had a major overhaul in the rendering pipeline, so I suspect that has something to do with it.

I made a simple example that continuously adds objects to the screen, then tried to profile what was going on with WebGL using Safari dev tools. I observed several instances where the frame before everything breaks appears to get to up to around 24,000 indices to render in the drawArrays call. The, in the next frame, the breaking behavior is observed and there appear to be 2 drawArrays calls being made, rather than the 1 in the previous frame. I don't know if this is related, but it is a suspicious pattern that I observed whenever it would break.

Example Test Code

Here is a simple test project I've been using in various iterations. Many of the Phaser example projects exhibit this same behavior on the iPads I've tested.

{
  constructor ()
  {
    super();
  }

  preload ()
  {
    this.load.atlas('atlas', './atlas.png', './atlas.json');
  }

  create ()
  {
    const blitter = this.add.blitter(0, 0, 'atlas', 'foo');
    setInterval(() => {
      for(var i = 0; i < 250; ++i) {
        blitter.create(Phaser.Math.Between(0, 1024), Phaser.Math.Between(0, 768))
      }
    }, 1000);
  }
}

const config = {
  type: Phaser.WEBGL,
  parent: 'phaser-example',
  scene: [ Example ]
};
const game = new Phaser.Game(config);`

[CodestarGames]

I've ran into the same issue on our project recently. We're having to do an entire canvas implementation of our games to deal with this issue. It's been a huge pain in the rear. Disabling the use of metal for webGL "fixed" my issues on safari, but since we use WKWebkit as a wrapper, we can't set this setting.

[objectiveSee]

I am looking into some webGl performance issues as well @jfred1979. I have been focusing on Chrome for desktop (OSX) and testing the difference between using Canvas and WebGl. With webGL I get more dropped frames (red in screenshot) seen by profiling my React app using DevTools. It's unclear to me whether the performance issues are from GPU tasks taking too long, or some CPU task.

Have you looked into whether the same issues you are experiencing exist on Chrome? Thanks :)

[fielding]

iOS performance pushed me back to 3.24.1. Ported over the compressed texture support and the isometric tilemap support and almost have everything I want. Sorry, this post isn't more helpful. If anybody does end up going back to 3.24.1, temporarily or whatever, I'll be pushing up repos for the stuff I port over as plugins (same API as in 3.50+ or as close as possible with the plugins)

[orjandh]

I have had problems with black screen on iOS lately. It was fixed by disabling antialising as suggested in this thread https://phaser.discourse.group/t/ios-15-performance-drop/10369/8. However it seems like the performace is still a bit lower than on other platforms.

Edit: It does still crash eventually.

[CodestarGames]

I updated to ios 15.6 from 15.4.1 on my ipad mini 4 and ran one of our problem games on phaser 3.55.2 and it works now.

[photonstorm]

I can finally close this issue off - as 3.60 Beta 11 resolves iOS performance issues across the board (and the same for Android, too). Even desktop has had a shot in the arm speed-up, but it's mostly noticeable on mobile.