WebGL and canvas contexts

WebGL is a rendering context for drawing to the HTML5 element, and is an alternative to the 2D rendering context. Often, when someone mentions the canvas, they are referring to the 2D rendering context, which is accessed by calling getContext and passing in the string 2d. Both contexts are methods of rendering to the HTML5 canvas element. A context is a type of API for immediate mode rendering. Two different WebGL contexts can be requested, both of which provide access to different versions of the WebGL API. These contexts are webgl and webgl2. In the following examples, I will be using the webgl context and will be using the WebGL 1.0 API. There is also a rarely used context for rendering a bitmap to the canvas that we can access by passing in bitmaprenderer as a string value.

In the next section, I will introduce you to shaders and the GLSL shader language.