Three.js WebGLRenderer performance

Question

I have a Three.js application and sometimes I need to re-render the application completely. (I don't have any page reload)

I've seen examples that advise to reuse the WebGLRenderer variable. I tried this and memory leaks still appear. For performance purposes, I need to kill the WebGL context and instantiate a new one every time I need the scene to be redrawn, to avoid memory leaks caused by multiplication of WebGL contexts.

I've also seen that Three.js had built-in method to manage memory, like renderer.deallocateObject or scene.removeObject, but it seems they're no longer supported in new Three.js versions (mine is r69).

So, my question is: how can I release the WebGL renderer (WebGL context) and start a new one? I really need to keep only one WebGL context for my app's lifetime.

Any help will be appreciated. I also accept pure JavaScript solutions (without using Three.js)

Thanks

Answer 1

Use

obj.remove(tile);
obj.geometry.dispose();
obj.material.dispose();