Description
Hi again, you must be tired of me already, and I'll again annoy you on the subject of #96
I have noticed even if I only load a model at a time, I still get the warning, as you can check in this codesandbox link: https://codesandbox.io/s/react-three-fiber-context-loss-o33uq if you keep loading, unloading and reloading, you'll see that you'll end up getting the warning WARNING: Too many active WebGL contexts. Oldest context will be lost. this means the renderer is not being disposed when canvas is unmounted. Shouldn't it be? This is pretty much these stackoverflow qestions: https://stackoverflow.com/questions/21548247/clean-up-threejs-webgl-contexts and https://stackoverflow.com/questions/54323838/how-to-fully-clean-up-the-context-and-canvas-in-three-js. right now this is what i'm doing on my component:
componentWillUnmount() {
if(this.webGLRenderer){
this.webGLRenderer.forceContextLoss();
this.webGLRenderer.dispose();
this.webGLRenderer=undefined;
}
}but i have to previously get the gl from useThree() on a FunctionComponent
i'll note that on this case its not as bad as what i was experiencing on the previous issue mentioned since the contexts and renderers being lost are no longer being in use, that said I don't think its optimal having garbage renderers and contexts around.
It'd be nice if the canvas object itself could either destroy and dispose it's renderer and context once its unmounted or reuse the renderer (which may be clunkier imo)
this might also be interesting: https://threejs.org/docs/#manual/en/introduction/How-to-dispose-of-objects