Efficient VBO allocation in WebGL

Question

I'm writing a WebGL application that algorithmically generates geometry. The geometry will consist of between 4-150 objects, each consisting of somewhere between 16 and 2048 points, drawn as a TRIANGLE_STRIP through drawElements. The geometry will be static most frames, but will need to be animated in response to user input. In these frames when the geometry is updated, points/tris may be added or removed. Objects will also need to be added/removed over the program's lifetime.

What's the most efficient way to allocate/update VBOs in this context? I'm pretty sure I should be using DYNAMIC_DRAW and bufferSubData to update each object, but do I want to over-allocate a few huge VBOs (assuming the worst-case in terms of points-per-object) and define each object as an offset (object number * max size per object) and then have lots of allocated un-used VBO memory in the best-case? Or is there another approach I should try? Or is this small enough in terms of memory footprint that I'm over-thinking?

Answer 1

What's the most efficient way to allocate/update VBOs in this context? I'm pretty sure I should be using DYNAMIC_DRAW and bufferSubData to update each object.

This is indeed the way to go. Actually you want to use double or even triple buffering for your objects, i.e. have one VBO bound for drawing, while you update the contents of the other with the new data. After glMapBuffer the memory map can be accessed from all threads in the process, so you can have a worker thread updating the "back" vertex buffer, while the rendering thread is busy drawing the current frame.

Or is this small enough in terms of memory footprint that I'm over-thinking?

Did you evaluate the worst case memory footprint you're dealing with? Given your numbers, I bet it will be below 16MiB (150 objects * 2048 points * 3 double precision floats per point * 8 bytes per double = 7.4 MiB, only 3.7MiB if single precision floats are used). Compare this to the several hundreds of MiB of RAM modern graphics cards offer (my 2006 GeForce 8800GTX has 768MiB RAM, and my Radeon HD6570 has 1024MiB(=1GiB).