Rendering

Rendering happens frequently. This function is invoked by the browser soon after an animation frame is requested. It may be called as often as 60 times per second (or more).

For this reason, it should be as efficient as possible. It should not do anything unnecessary. Anything that can be done in the initialization function should be done there.

〈Rendering〉 ≡
  function draw()
    gl.clearColor(0.0, 0.8, 0.0, 1.0);
    gl.clear(gl.COLOR_BUFFER_BIT);

    gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
    〈Configure the vertex attributes
    〈Enable the vertex attributes

    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, triangleBuffer);
    〈Draw the triangle elements