Hello, i can’t find anything about keeping the memory clean, i have made lots of researches but nothing useful came out. Since my project is a bit big and i use the terrain generation from heighmap to respawn the terrain for different locations i reach a point where the memory overflow. Any tips that can help me atm?
Thanks @neoflash i already knew it, but i have read it again, maybe if i use all the houses models by disabling and re-enable them instead destroy and make new ones i will have some result, though i think also changing the heightmap in terrain.js to draw a new scenery is also quite expensive. Thought of making different terrain.js but that doesn’t seems to be a good solution either. Maybe there is a way to rewrite rigidbodies and collisions without creating garbage but don’t see how.
Modified all the code for houses without destroying them, but nothing change, so the problem is when you respawn the heightmap terrain…will be an hard fight…hope to win or my project will reach an early end.
2 Likes
Partially solved reducing the heightmap.jpg files from 2048 to 1024 the result is the same and the memory usage is halved. Anyway a way to clean the memory from removed components would be nice 
1 Like
Memory management in Javascript/WebGL apps is a big chapter. Don’t hesitate to learn whatever it takes to get it right. It will make a difference as you say to the life of your project.
Javascript is very forgiving in many aspects, thanks to the garbage collector, amount of libraries and frameworks you can use out of the box and easiness of use. This might benefit a project to get an easy start but there are no shortcuts in making it perform admirably.
Some tips to get you started:
- Take it right, read and study how Javascript and garbage collection works. It will make you a far better programmer.
- Understand how 3D works, how each frame is generated, how much time it has to take so app renders in 60FPS, how much memory your textures occupy in VRAM. Use compressed textures if you are able to. On mobile the boundary between RAM and VRAM is blurry, so test and profile regularly in the devices that you are deploying.
- Learn how the JS garbage collector works. How and when memory is allocated and freed. Understand how scope works. Pre-allocate whenever possible, this can’t be stressed enough. Learn to free memory and resources not needed anymore. Balance between time needed to reload/reprocess and memory budget.
- Don’t run everything on each frame. E.g. checking if the player is close to an object might be enough doing it only 2-3 times in a second.
- Use the Chrome profiler to understand how much memory your code consumes. Use breakpoints and/or comment out parts of your codebase to get accurate.
- Do the same with the 3rd party libraries/code that you are adding in your project. Even a popular library might have performance issues or not play well with your codebase. Profile everything!
Enjoy the process. 3D in the browser is a demanding thing, getting it right though will polish your skills greatly. Good luck!
1 Like
Thanks @Leonidas i will go through every single step you pointed out, don’t know why but seems a really hard work 
But as someone told, when the game gets tough the tough start playing …I will win or die trying lol
1 Like