I searched for others with the same issue as mine and found this post here
I’m new on three js and i’ve done some javascript prototypes before using R3F (the tool that i’m using right now to build this website), I’m not sure if you guys can help me since I’m using R3F but I thought that i’d give it a try.
The problem is that I’m rendering three planets with some subtle animations, as well as two 2D images using Drei’s component and a starfield with some points that ‘twinkle’, i noticed that if i hide some of the planets, I’d gain performance on chrome, but firefox is fine even with the whole scene being rendered.
With Chrome’s hardware acceleration, it seems better (on par with Firefox).
My question is, how can i know if i’m having performance issues? I tried reading the performance tab on chrome devtools but it wasn’t quite clear where to work on to improve that.
Here’s a screenshot of the performance panel: