Using drawArrays

We will call drawArrays when information about indices is not available. In most cases, drawArrays is used when the geometry is simple enough that defining indices is overkill – for instance, when we want to render a triangle or a rectangle. In that case, WebGL will create the geometry in the order in which the vertex coordinates are defined in the VBO. If you have contiguous triangles (as we did in the trapezoid example), you will have to repeat these coordinates in the VBO.

If you need to repeat many vertices to create the geometry, drawArrays is not the optimal method, because the more vertex data you duplicate, the more calls you will have on the vertex shader. This can reduce the overall performance, since the same vertices must go through the pipeline several times, one for each time that they are repeated in the respective VBO:

The signature for drawArrays is as follows:

gl.drawArrays(mode, first, count)

Where:

• mode: Represents the type of primitive that we are going to render. The possible values for mode are gl.POINTS, gl.LINE_STRIP, gl.LINE_LOOP, gl.LINES, gl.TRIANGLE_STRIP, gl.TRIANGLE_FAN, and gl.TRIANGLES.
• first: Specifies the starting element in the enabled arrays.
• count: The number of elements to be rendered.