Weird jitter of objects in Three.js using Mali GPU

Question

I have a strange problem which has been bugging me for quite a while now, the issue is best explained by a short video:

As you can see the objects in the scene have a jitter when you move the camera around but also a similar thing happens every now and then when the camera is not moving. It's been driving me crazy for a while now. This video has been taken on a Tinkerboard with TinkerOS, but the same issue is also there on a Tinkerboard with FlintOS.

On a regular laptop there is no issue and everything is moving smoothly. I'm not sure if this is a bug or if it is expected behaviour seeing the differences in hardware, so I was hoping somebody could shed some light on this.

Here is a WebGL report from the Tinkerboard:

Here a WebGL report from my laptop:

Obviously there are differences but I have no idea if any of these difference would explain this behaviour.

Can anyone clarify?

Thanks!

Answer 1

The most likely issue is precision; most mobile GPUs map mediump variables in shaders to FP16 data types, most desktop GPUs map them FP32 data types.

What are your shaders here? Try using "highp" everywhere you compute positions.