0

We have a fairly extensive three.js application using quite a few materials, scenes, render buffers etc. We could only refresh/restart it a couple of times and it would fail on one of several issues; all of which amounted to running out of WebGL resources.

I have added a cleanup routine on window.onbeforeunload, that calls dispose() methods on the objects that support it; materials, renderBuffers and geometries. I'm not convinced I have caught all resources; but it seems to have been enough as I have been able to refresh every five seconds for half an hour.

The questions are: [1] What is the best way to trigger such a cleanup? window.onbeforeunload seems quite effective, but maybe there is reason to choose some alternative?

[2] What is the best way to perform such a cleanup? It would be good to have a dispose on the renderer that cleaned up all the WebGL resources. (I'm not concerned about the javascript objects, as the browser seems quite capable of cleaning those up.)

I have seen related questions here; eg on cleaning up scenes, but I am interested in a complete cleanup. I guess any answer at the lower WebGL level would work too for this global cleanup; which it might not for just some three.js resources as it wouldn't be able to work out the scope of these smaller cleanups.

Stephen Todd
  • 365
  • 3
  • 12

2 Answers2

1

Generally, when a web page is unloaded, it is not the page's responsibility to perform any kind of cleanup; its resources are simply discarded all at once. Otherwise, sloppy or malicious pages would frequently cause trouble. WebGL is no different.

You should treat the behavior you're seeing as a browser bug, figure out a simple test page which demonstrates the problem, and report it to the browser vendor(s). This will solve the problem for everyone and reduce your maintenance burden in the long run.

Kevin Reid
  • 37,492
  • 13
  • 80
  • 108
  • Good point, thankyou. I'll test it out on a different browser (problem was in Chrome) and try to make a simple page that illustrates the bug, preferably without using three.js to keep it as simple as possible. – Stephen Todd Aug 01 '13 at 11:51
  • http://coding.smashingmagazine.com/2012/11/05/writing-fast-memory-efficient-javascript/ – Hobbes Aug 02 '13 at 08:57
1

This is a known issue in chrome 28, and has been repaired in the next release. You can download the beta version and see for yourself.

Hobbes
  • 781
  • 10
  • 29
  • Thankyou. I've installed Chrome 30 in parallel, and as you say, all seems to work ok. Thanks to http://stackoverflow.com/questions/3785991/can-i-run-multiple-versions-of-google-chrome-on-the-same-machine-mac-or-window for parallel install. And http://www.oldapps.com/index.php/google_chrome.php for a later version (which it calls dev) hidden under the heading 'Old Version of Google Chrome' – Stephen Todd Aug 02 '13 at 08:27
  • Freaked me out. I thought i made some kind of serious error. I was quite glad to find out it wasn't my fault =] – Hobbes Aug 02 '13 at 08:46