Issues with Memory Overload and Looping on web mobile

Hello Babylon.js Community,

I’m encountering an issue when attempting to run my Babylon.js application on Safari on mobile devices. The problem appears to be related to memory overload, as the page enters a continuous reloading loop. I’ve noticed that by commenting out the importation of some heavy assets, the problem disappears, but I need these assets for the full functionality of my application.

Here are some details:

  • Affected Platform: Safari on iOS
  • Observed Behavior: Continuous reloading loop when all assets are loaded.
  • Temporary Solution: Commenting out the importation of heavy assets prevents the loop, but it is not ideal.
  • Speculation: It seems to be a memory management or resource overload issue.

I am looking for solutions or suggestions on how to optimize asset importation and usage in Babylon.js specifically for mobile access. Any tips on best practices or specific configurations that might help alleviate this issue would be greatly appreciated.

Thank you for any help or guidance you can provide!

Hi @djony.costa, welcome aboard!

Probably you have hit a vram memory limit (it depends on the device, probably 1gb most common). I had this issue few ios versions ago, meanwhile I didn’t see it again. As a workaround I recomand you to use compressed textures instead of png, jpg, they are the same, but more VRAM friendly
https://doc.babylonjs.com/features/featuresDeepDive/materials/using/ktx2Compression
After this, if no luck, come back, there are plenty workarounds for iOS :frowning_face:

Hello :slight_smile:

As @MarianG said, texture can be an issue, but the fact that it is “the” bottleneck really depends on your scene.

You spoke about “heavy assets”, if you mean heavy by a matter of number of polygons, then you definitely wanna reduce the polygon count for the mobile version of the App. (To do so, multiple tools such as the Decimate or Remesh Modifiers of Blender can be usefull)

You can also have a look at the Level of Detail trick, where you can still load high detail version but only for objects close to camera, freeing some compute power for the objects which are far

++
Tricotou

Thank you for the valuable suggestions regarding the performance issues on mobile Safari. I’ve implemented some of your recommended optimizations, such as converting textures to WebP, which have helped somewhat.

However, I’m still facing challenges with very large assets that are a few megabytes in size. Removing these assets allows the application to run smoothly.
I will try to optimize thoses assets.

Thanks again for your help