Performance issue after last chrome/edge update

Questions
, ,
1

Hi,

I’ve noticed that after last browser chrome/edge update animation on r117/r126 (yes, it’s quite old versions but worked fine till now) has strange issues with downgrade framerate during play - stats shows 60fps all the time, but animation framerate visually looks different from part to part… some parts play fast, some start play visually much slower and these slow parts is quite random. One animation can play fine now and after few seconds this anymation partially can be slow. Also on mobile device after android chrome update all performance extreamly degraded from 60fps to 15-20fps.

Are there any similar issues with new revision of threejs ? Does anyone knows is this browser issue or not? I bealive it is due to all works fine till last chrome/edge update and project wasn’t changed.

UPD It seems that at least on mobile chrome fps of threejs examples also extreamly degraded same way (littlest Tokyo – 15fps etc)

2

Chrome made changes. I don’t know what was changed in detail, but I had to change one of my apps in which I still had a WebGL1 shader. I made the WebGL1 shader to a WebGL2 shader and had to set “precision highp float;” to get the same result.

3

Thanks for reply! So, I need to make same changes then…

But I don’t know why on mobile device examples of threejs with low fps (with WebGL2). For example Soldier, morph robot about 30fps, but they certainly were 60fps (at least morph robot for sure). May be cache issue or smth

UPD I’ve updated shaders and tested on r126 (isWebGL2 now true, previously was r117 and there isWebGL2 was false) - same result, same issue. It doesn’t help… May be newest r155 helps but I doubt it.

4

Ok. It seems that I’ve found what makes animation slow/fast time to time when fps are the same… I’m using one clock for whole app. Clock.getDelta() executed once before update, but Clock.getElapsedTime() executed several times with various conditions. I didn’t know that getElapsedTime() also updates delta (i.e. getDelta - is main func that updates all and getElapsedTime just executes it) and as result when next render call happens I have wrong delta… May be the best solution split logic of getDelta() and getElapsedTime() ?

But as to low fps on mobile device is still the issue after chrome/edge update. animation/skinning/morph robot @ 30fps on Samsung S22 Ultra… it was 60fps