I have ReactJS app, which is using PixiJS 4. I am certainly calling stage.destroy(true)
as well as removing renderer view from canvas element and destroying renderer when my script no longer need it. However, how can I cleanup all this in case user just closed browser window/tab? Looks like ReactJS life cycle routines doesn't provide such callback.

- 28,133
- 34
- 125
- 215
-
If the user just closes the browser window/tab, then your PixiJS instance, canvas, renderer, views, stages, etc. all get destroyed anyway. You dont have to worry about cleaning up on browser close. – Mikepote Feb 09 '19 at 19:53
-
@Mikepote how about textures allocated in GPU memory? – Pablo Feb 09 '19 at 19:55
-
`componentWillUnmount` is where you can do all of the clean up... https://reactjs.org/docs/react-component.html#componentwillunmount – SakoBu Feb 09 '19 at 20:24
-
@SakoBu it doesn't get called when window/tab is closed – Pablo Feb 09 '19 at 20:33
1 Answers
When the browser window is closed, your program is dead anyway and the browser automatically releases any resources used by the page and the JS executing on that page. So you don't have to worry about this case.
If you are pedantic, then attach an event listener to onBeforeUnload and do your clean up there: Run JavaScript code on window close or page refresh?
And if you are worried about HTML 3d canvas contexts, read this PixiJS issue that describes how to release WebGL contexts: https://github.com/pixijs/pixi.js/issues/2233
I'll summarise it here. Of course, it's different for each browser:
Firefox seems to support this technique to force the context loss:
gl.getExtension('WEBGL_lose_context').loseContext();
However, lose_context() is only a simulation (according to the spec) but in this thread (Public WebGL: WEBGL_lose_context we learn (from mozilla developer Jeff Gilbert) that in Firefox
loseContext()
is a byword for "release this context and its resources" .The problem is that other browsers handle this differently. There are comments from a Google developer (Ken Russell) recommending : Please use the explicit delete* APIs on the WebGLRenderingContext to release GPU resources that your application is no longer using.
Searching more for this error: "WARNING: Too many active WebGL contexts. Oldest context will be lost." may yield more insight into it.