Open responsive-we opened 9 months ago
same problem
Have u found the solution?
Yeah facing the same issue.
Solution 1: Reduce the number of 3d models (canvas) in code, because chrome mobile supports lesser number of canvasses at a time I guess it is 16 if it exceeds the first canvas will be dropped and 17th one will get added,
What I did was that i removed the sphere 3d balls which released a lot of canvasses, and my web was working fine on mobile Chrome
Solution 2: Use Firefox on Android (or safari on iOS), Firefox can handle more canvasses than chrome.
remove those balls, there is a limitation for canvas elements on a browser, remove the balls and instead, return some images or whatever you want
@characterMi working...Thanks @WaniAthar working...Thanks
Did anyone find any alternative for chrome mobile browser?
Yes you can remove the skills balls and your code will be working fine. you can see my portfolio for example: https://mdayan.onrender.com/
Thanks, I meant with keeping all the skills balls
Nope, then your website can only be opened on safari or firefox in mobile phones
Do you know what the cutoff is?
Yeah but the contact form's 3d model isn't appearing even after removing the skill balls.
@Akxai @alistairalva that's true, it's because u r rendering 3 canvases and as i said u can only render 2, so here is what i did, i simply moved the stars component inside of the EarthCanvas component, and it worked.
here is the link to the live site: https://charactermi.github.io/second-portfolio
and the source code: https://github.com/charactermi/second-portfolio
@characterMi it looks dope 🔥, thank you.
@Akxai @alistairalva that's true, it's because u r rendering 3 canvases and as i said u can only render 2, so here is what i did, i simply moved the stars component inside of the EarthCanvas component, and it worked.
here is the link to the live site: https://charactermi.github.io/second-portfolio
and the source code: https://github.com/charactermi/second-portfolio
Thanks I added a check to render static elements when in mobile view and the 3d balls when in desktop view
Whenever I try to open this website on my phone or tablet. It is not able to load the 3d models I used the planet the earth and the balls. I aslo have hosted these websites on two different providers. But still there is same error. But when I inspect it in my pc and make it load in screen resolution it loads up. Here is the link of reop: portfolio Here is the link of deployment on vercel: vercel Here is the link of deployment on render: render