FPS drop with trackballControls on the new chrome on mobile.

[boulabiar]

Description of the problem

With the recent Chrome updates on mobile, the FPS drops to 2 FPS when zooming with two fingers.
The FPS for this example is around 60. it drops to 2FPS and creates saccades then get back to normal after the operation. This doesn't happen with single finger operation, only with 2 fingers zoom.
https://threejs.org/examples/misc_controls_trackball

Three.js version

• r92

Browser

• Chrome mobile

OS

• Android

Hardware Requirements (graphics card, VR Device, ...)

[Mugen87]

I've tested the example on my Pixel with Chrome 66.0.3359.126. Although the performance monitor shows sometimes low frame rates, the experience does not feel jerky but smooth to me.

BTW: The example does not have an active render loop. This might explain the inconsistent FPS values reported by stats.js.

[boulabiar]

I've tested this on a smartphone and a tablet. As I've explained, the frame-drop only exists when using two-finger zooming.
This is what it looks like on the same version of Chrome :
https://www.youtube.com/watch?v=07VdKlSBIa4

[Mugen87]

Wow, that's definitely jerky 😳. Thanks for the video 👍

As I've said, I'm unable reproduce this on my smartphone. Which particular devices are you using? Besides, does this also happen with Mobile Firefox?

[boulabiar]

I have made tests on the OnePlus 3T, and Google (HTC) Nexus 9.
This only happens on the last Chrome mobile versions (at least since 2 months).
Firefox don't have these problems.

It looks like it is a common problem added to chrome.
I've tested a fix and it works. I will submit this in few hours.

[boulabiar]

I've made a fix that removed that behavior.
#14017

[mrdoob]

This only happens on the last Chrome mobile versions (at least since 2 months).
Firefox don't have these problems.

Wouldn't this be a Chrome bug?

[Mugen87]

@boulabiar Do you mind reporting this here instead: https://bugs.chromium.org/p/chromium/issues/list

[boulabiar]

I reported it here:
https://bugs.chromium.org/p/chromium/issues/detail?id=841282

[boulabiar]

Can you please confirm the issue and star it on chromium?
I tested on another smartphone: Asus Zenphone 2 and it has the fps drop.

@mrdoob you have your Google pixel 9 with you? Can you please try it and confirm the issue on chromium bug reporting site?

[boulabiar]

Update: Chrome developers stated that this is a bug, but also an "intentional change".
https://bugs.chromium.org/p/chromium/issues/detail?id=841282

The bug is present and can be seen on every chrome mobile.
So in this case, what to do? Ask Chrome people to undo the policy, or update Trackball controls as they've said by adding |touch-action: none| ?

[Mugen87]

Chrome developers stated that this is a bug, but also an "intentional change".

I don't get this 🤔

or update Trackball controls as they've said by adding |touch-action: none| ?

Can you confirm that adding this piece of CSS solves the issue?

[boulabiar]

Yes this line resolved the problem for chrome.
this.domElement.style.touchAction = 'none';

is this the file to edit to add it ?
https://github.com/mrdoob/three.js/blob/dev/src/renderers/WebGLRenderer.js

[Mugen87]

This would be the right place:

three.js/examples/js/controls/TrackballControls.js

Lines 14 to 15 in a17dc8c

	this.domElement = ( domElement !== undefined ) ? domElement : document;