Image distortion and low framerate when using WebGL on Nexus devices

[Sturm Flut]

Devices: Nexus 4 and Nexus 7 (2013)
Image Version: r187 (all older images were also affected)

Steps to reproduce:
1. Download a WebGL app from the Ubuntu Store (e.g. HexGL) or go to a website that uses WebGL (like http://helloracer.com/webgl/ or http://hexgl.bkcore.com/play/)
2. Start the game/demo

What happens:
The display flickers heavily and the framerate is quite low

What should happen instead:
No flickering, acceptable framerate

How to reproduce the correct behaviour:
- Use stock Android (4.4.4) and Chrome or Firefox on both devices
- A number of WebGL sites like http://www.randelshofer.ch/webgl/rubikscube/ actually works correctly

Severity:
In the beginning most Ubuntu Touch games will be encapsulated webapps (like HexGL), so this should probably work.

[Sturm Flut (sturmflut)]

The problem still persists with Image r213.

I noticed that HexGL offers different platform and graphics quality modes on the start screen: "Desktop" versus "Mobile" and "High/Mid/Low" quality. If I select "Mobile" and "Low quality", resolution is very low and the quality is very bad, but the screen does not flicker and there is no distortion. With the default setting of "Desktop" and "High quality" everything flickers and there is a lot of distortion.

[Sturm Flut (sturmflut)]

I took one of the Qt3D examples and ported it to Ubuntu Touch:

https://github.com/Sturmflut/ubuntu-touch-qt3d-cylinder

Works like a charm, so the problem seems to be confined to the the browser engine.

[Sturm Flut (sturmflut)]

I tried HexGL today on the same Nexus 4 (mako), now on stable Image r15.

Using the "Mobile" and "Low quality" settings, the display flickers maybe once every ten seconds.

Using the "Desktop" and "High quality" settings (which are the default), the problem is even worse than before. The display flickers so much, it is hard to see what's happening in the game.

The Rubik's Cube still works finde.