Gdevelop: Glitches on some MediaTek devices

[Ardeye]

Describe the bug

Any game exported to android is broken on some MediaTek devices. When exported to web this also happens with webkit based Via browser but works in Chrome.

To Reproduce

Steps to reproduce the behavior:

1. Make any game in GDevelop. For example, this preinstalled Space Shooter game.
2. Export it to Android through the GDevelop build service or Adobe PhoneGap.
3. Try to open on a MediaTek device.
4. See glitches

• link to the game: http://gd-games.s3-website-eu-west-1.amazonaws.com/game-1559029548136/
• what happens: https://www.youtube.com/watch?v=lqH0JVw1ptM&feature=youtu.be

Other details

• I've tested on mediatek 6737, mediatek 6797 (helio x20) both android 6 - glitched. But Mediatek 6750 android 7 works fine.
  Also tested on Snapdragon 625 android 7, Kirin 710 android 8, Exynos 4412 android 4.4 - everything's fine.
• Version of GDevelop 5b68 for Linux or Windows, no difference. The desktop app.

[4ian]

Can you check the version of Chrome running on these Android 6 devices?
Also any other glitches with other games?

This looks like a device with buggy GPU drivers.

[Ardeye]

Thank you for the reply!
Chrome 74.0.3729.157
Another device which has the same bug is LeEco Le S3 x626
Relevant for any exported game

[bil-ash]

This issue exists not just on Mediatek devices but also on some Unisoc (erstwhile Spreadtrum) devices (including mine). The only workaround which works for me is changing the renderer to Canvas (instead of WebGL) in the file runtimegame-pixi-renderer.js after local export. Using canvas renderer consumes about 10% more RAM as compared to WebGL but at least the problem is solved.
PS: I do not have any production level projects.

[4ian]

Thanks for investigating :) This would go in favor of a bad WebGL implementation on the these devices :/
Unfortunately, this is not good for the future, because as the years pass, it's more and more likely that rendering will go toward full WebGL for performance (in GD or elsewhere). Two possible ways to fix that in the future:

• Upgrade Pixi.js (the rendering engine) and hope things are better (thanks to fix on their side).
• Upgrade your devices Android version and hope they updated the graphic drivers (unfortunately, manufacturer rarely do support properly their devices like this).

For now, activating canvas can be a good solution - though it's much less performant than WebGL.

[bil-ash]

From v5 onwards, pixi.js ships with only WebGL by default. Canvas renderer has been moved to a separate file. This is even worser. At the moment, time is not ripe to leave away android 5 and 6(out of the buggy devices, 2 run android 6 and 1 runs 5.1)

[Ardeye]

This issue exists not just on Mediatek devices but also on some Unisoc (erstwhile Spreadtrum) devices (including mine). The only workaround which works for me is changing the renderer to Canvas (instead of WebGL) in the file runtimegame-pixi-renderer.js after local export. Using canvas renderer consumes about 10% more RAM as compared to WebGL but at least the problem is solved.
PS: I do not have any production level projects.

Thanks! What should I change in this file to enable Canvas rendering?

[bil-ash]

Somewhere towards the beginning of the file you will find PIXI.autoDetectRenderer .
Replace that with new PIXI.CanvasRenderer

[bil-ash]

Here is the link to pixi documentation on this-
https://pixijs.download/v4.8.8/docs/PIXI.CanvasRenderer.html

[Ardeye]

Somewhere towards the beginning of the file you will find PIXI.autoDetectRenderer .
Replace that with new PIXI.CanvasRenderer

Thank you! Everything works now :)