Using Lights, Normals, and Materials in the Pipeline

In Chapter 2, Rendering, we discussed that WebGL buffers, attributes, and uniforms are used as input variables to the shaders, and that varyings are used to pass information between the vertex shader and the fragment shader. Let's revisit the pipeline and see where lights, normals, and materials fit in:

Normals are defined on a vertex-per-vertex basis; therefore, normals are modeled as a VBO and are mapped using an attribute, as shown in the preceding diagram. Note that attributes cannot be directly passed to the fragment shader. To pass information from the vertex shader to the fragment shader, we must use varyings.

Lights and materials are passed as uniforms. Uniforms are available to both the vertex shader and the fragment shader. This gives us a lot of flexibility to calculate our lighting model, because we can calculate how the light is reflected on a vertex-by-vertex basis (vertex shader) or on a fragment-per-fragment basis (fragment shader).