Or does it swap a program for each material even if they are all the same MeshPhongMaterial? I’m imagining that it would optimize and only change the underlying attributes and uniforms, but I haven’t dug into that part yet.
three.js always tries to reuse shader programs. However, there are material properties like alphaTest that produce a different shader program when they are set. So even if two material objects are of type MeshPhongMaterial, the resulting shader program is different if one object sets alphaTest to true.You find a list of these material properties in the How to update things guide.
You can easily check the amount of programs by yourself via debugging renderer.info.programs. This property represents an array of shader programs used to render the scene.
2 Likes
One more thing: three.js sorts its render list in a way so objects with the same program or material are rendered together. This strategy reduces the amount of WebGL state changes due to program changes.
4 Likes