How does three.js run shader programs

Viewed 100

I want to understand how three.js works internally. One thing I don't understand is how three.js compiles and runs shader programs. If I were to reimplement three.js myself I would have a vertex shader attributed to a Geometry and a fragment shader attributed to a Material and then generate a shader program when they are combined in Mesh. But looking at the geometries and the materials they don't seem to reference any shader. Furthermore, the shaders (in the folder three.js/src/renderers/shaders/) in the project don't seem to be attributed to any specific Geometry/Material. I was wondering whether someone could shed light on how the three.js compiles and runs shaders.

1 Answers

Notice that Geometry is internally converted BufferGeometry. Instances of BufferGeometry do have attribute data which are later mapped to the respective shader program.

The default shader attributes which are available in all materials expect RawShaderMaterial are listed in the documentation of WebGLProgram. Additional custom attributes are not automatically added to shader source code. You have to enhance built-in materials or write a custom shader program in order to add such attributes to your GLSL code.

Related