Initializing Shaders in WebGL
OpenGL ES Version 2.0—and therefore WebGL—is a shader-based API, like OpenGL, requiring every application to use vertex and fragment shaders for its rendering. As such, you encounter the same requirement of loading shaders as you saw in OpenGL.
To include vertex and fragment shaders in a WebGL application, it’s simplest to include the shader as a script in the HTML page.2 A shader within an HTML page needs to be identified correctly. There are two mime-types associated with WebGL shaders, as shown in Table B.1.
2. It is possible to store the shader in a separate file from the original HTML page, but the mechanism is very cumbersome with current Web technology. We’ve opted for the simple approach here.