The number of WebGLProgram in renderer.info.programs increase when material sets "map" and "needsUpdate" property

Questions
1

material.map is undefined, then I set material.map = new THREE.Texture() and material.needsUpdate = true. And I find the number of WebGLProgram in renderer.info.programs increase.

I didn’t find any case in threejs examples that material should dispose before set “map” property.

Should I dispose the material before set material.map and material.needsUpdate?

  • version of threejs: r164

Here is the code：

image
image1920×931 178 KB

After multiple edits in threejs editor, a large number of useless WebGLProgram will be generated, and I don’t know how to deal with these WebGLPrograms.

2

Yes, since in this case you use “new”, ie. you’re creating a new Texture every time instead of overriding previous one with a different source image.

3

Maybe use dispose for all textures into material and then dispose for material.

5

I couldn’t find any examples that dispose material and textures before set map in the Three.js documentation. So I’m not sure if it’s correct.

6

Just disposing of materials and textures isn’t enough. You need to ensure there are no references to the disposed objects so they can be garbage collected. For example, if you console.log an object, it won’t be collected because the console holds a reference to it.

7

https://threejs.org/docs/index.html?q=dispos#manual/en/introduction/How-to-dispose-of-objects