React Three Fiber App Crashing on iPhone and Android

Hello,

I have deployed my app and it works on desktop device but it crashes on my mobile. It loads at first instance, but as I scroll down it crashes. I have tried removing mesh one by one and found that it worked on mobile device but when I added them back again, it crashes. I’m not able to understand the exact cause. I have spent a lot of time on this, can someone help me please? @donmccurdy

Here is link to app: https://prajaktapikale.vercel.app/
Here is link to GitHub: GitHub - pj499/prajakta_3D_portfolio

Hi. In my opinion it’s every inefficient to render each ‘Ball’ within its own ‘Canvas’. Also, you creating ‘directionalLight’ and ‘ambientLight’ in the same way which cause intensive load on your system. The amount of parallel WebGL contexts is limited and vary on different devices. That’s why your app works on desktop, but crashes on mobile. Try to remove like six of that ‘Balls’ (or even more if needed) and you’ll see the difference.