Geek Answers Handbook

Memory leak in Three.js file

We are trying to create a one-page application in which the user can switch between several Three.js applications. However, we notice a constant increase in memory usage in the tab. There are no memory leaks in our application and it seems that Three.js variables are not cleared from RAM.

Recreation Steps

  • Visit http://threejs.org/examples/ and open the task manager in Google Chrome to notice the memory usage of the corresponding tab.
  • Keep switching between examples and you'll notice a steady increase in memory usage, and it looks like the GC never happens or cannot uninstall a previously consumed memory block.
  • For my laptop with the following configuration https://aboutmybrowser.com/pDp7aTxH the memory is easily removed above 1 GB when everything starts to freeze.

I noticed 2 errors written to chrome and firefox about this memory problem, but no solution has yet been provided.

Please help me on how to free my memory, most of the things I found on the Internet do not help.

PS: I also filed an error in Three.js https://github.com/mrdoob/three.js/issues/4276

+8
javascript memory-management memory-leaks
source share
1 answer

Here is what helped

  • Create an array that will contain all the elements added to the scene.
  • When adding an additional element to the scene, add it to this array.
  • In kill mode, run scene.remove ('item name') to remove them from the scene.
  • Now iterate over the array and manually make all the elements undefined.

Thus, I was able to free more than 600 MB of memory messages by moving to another page.

Update Response by Mr. Oak and WestLangley Memory leak using three .js and many figures

In webGLRenderer after deleting the grid with

scene.remove( mesh ) ,

you can free memory with

renderer.deallocateObject( mesh );

You can free the texture with

renderer.deallocateTexture( texture );

+7
source share

More articles:


All Articles