Use single vertex buffer or many?

4
votes

I'm implementing a 2D game with lots of independent rectangular game pieces of various dimensions. The dimensions of each piece do not change between frames. Most of the pieces will display an image and share the same fragment shader. I am new to WebGL and it is not clear to me what the best strategy is for managing vertex buffers in regard to performance for this situation.

Is it better to use a single vertex buffer (quad) to represent all of the game's pieces and then rescale those vertices in the vertex shader for each piece? Or, should I define a separate static vertex buffer for each piece?

1
webgl

1 Answers

6
votes

The GPU is a state machine, switching states is expensive(even more when done through WebGL because of the additional layer of checks introduced by the WebGL implementation) so binding vertex buffers is expensive.

Its good practice to reduce API calls to a minimum.

Even when having multiple distinct objects you still want to use a single vertex buffer and use the offset parameter of the drawArrays or drawElements methods.

Here is a list of API calls ordered by decreasing expensiveness(top is most expensive):

  • FrameBuffer
  • Program
  • Texture binds
  • Vertex format
  • Vertex bindings
  • Uniform updates

For more information on this you can watch this great talk Beyond Porting: How Modern OpenGL can Radically Reduce Driver Overhead by Cass Everitt and John McDonald, this is also where the list above comes from.

While these benchmarks were done on Nvidia hardware its a good guideline for AMD and Intel graphics hardware as well.