`WebGLRender.dispose` has no effect

Questions
1

Hi! Beginner here!

I followed the basic example from the three js docs, “Creating a scene” and for my application, I need to make sure that the WebGL context is freed when changing the scene.

I noticed that calling WebGLRenderer.dispose() has no effect. To demonstrate this, adding renderer.dispose() in the animation loop has no effect.

In this JS fiddle, add the following line:

function animate() {
	requestAnimationFrame( animate );

	cube.rotation.x += 0.01;
	cube.rotation.y += 0.01;

	renderer.render( scene, camera );
+	renderer.dispose()
}

and notice that it has no effect. Is this a bug? How do I clean up the WebGL context?

2

Calling WebGLRenderer.dispose() has an effect and it is not recommended to continue calls of render() after you have used this method. Yes, rendering will still work since the renderer recovers parts of the internal state but important event listeners will be removed from the context which can’t be undone.

I suggest you switch to setAnimationLoop() like in the following fiddle. This will make the usage of WebGLRenderer.dispose() more as expected. Notice that with the upcoming release r165 all example code uses setAnimationLoop() so it is the new recommended way to configure the animation loop.

Live example: Edit fiddle - JSFiddle - Code Playground

1 Like
3

Sidenote: If you really have to destroy the WebGL context right away, you can call renderer.forceContextLoss() right before calling dispose().

2 Likes