Hi, I’m trying to find out the reason why my site is working fine on desktop but giving me the black screen on android without any error (chrome dev tools when I resize to mobile view)
Website link (its still in development) - Vite + React
One key thing I’d like to mention here is I’m using 16k ktx2 images as texture, tried switching to 8/4k but still didn’t worked on my mobile. I know its lot a lot of pixel but my project is demanding it. Switching the image from webp to KTX2 did help increasing the performance on desktop. I want to cater to mobile and desktop users but I doubt if I’ll have to leave mobile users on the table.
It looks like it starts to load (android) and then tops out at some point… I doubt any mobile device can handle 16k textures in a webgl environment at this time, I’ve found that even with a few 4k textures lower end ios devices will top out and force reload,
Is there any way for it or else I’ll need to put a div with notice that this only works on desktop.
2k is too low for this project, the map will look blurry.
You could try not loading them all at once on mobile and rather have a thumbnail that clicks through to load a specific map and dispose after close, otherwise, you could try to load each map in optimised 1024 tiles, this may be a long approach, it would likely allow the page to load but may significantly drop frame rates…