I wanted to try out twgl.js[1], a library that helps with the boilerplate of WebGL.
Notes:
- wow, twgl parses my shader and figures out what all the uniforms and attributes are!
- twgl drawObjectList makes one draw call per item in the list, but reuses program and attributes when it can
- I took an example from twgl and modified it to use VAOs, because I wanted to learn VAOs
- a VAO lets you move the many vertexAttribPointer, enableVertexAttribArray, disableVertexAttribArray calls that are normally per render into something done at init time
- when using VAOs, need to pass the attribute list to
createProgramInfo
so that it can assign them locations- so I can’t use the attribute list it parsed for me :-(
- but this allows me to have multiple shader programs that share a single VAO, with the union of the attributes
- I used Safari’s webgl inspector (!) to look at how many gl calls were made per object, and there were 85 without VAO and 58 with VAO
- this is without trying to combine attributes from multiple shader programs