Bad performance on prudaction build

Hallo,

I have a performance problem with my threeJS app. I am using it inside a React application. (create-react-app). Inside the development build (webpack start) the 3D Scene runs fine and super fast. (300fps). However, as soon as I start a production build and upload the application to the webserver, the performance drops noticeably. (30-60 FPS)

Any ideas what triggers this behavior and how I can prevent it? I am grateful for any hints.

greetings

300fps already sounds strange, doesn’t the browser cap 60fps? there was a thread here recently where the culprit was the minimizer (use terser). and then there’s babel turning efficient code into crawling back-compat code. you can try playing with the browserslist field in package.json, for instance go last two chrome to see if the code is now fast, then check how low you can go. personally i would not compile classes and async, even at work we don’t do it any longer ie11 be damned.

2 Likes

Hello drcmda,

thanks for your advice. I set the production Browser list now to the same settings as development. Now it’s a bit better.

Yes with the 300fps is also a strange behavior. I have some ongoing rotation items and a particle waves in my scene. Unfortunately, their animations run so fast that you get sick. :slight_smile: Sometimes the FPS rate get even far over 300.

Bildschirmfoto 2021-07-08 um 07.23.13