Most efficient way to draw multiple identical objects?

Question

I would like to make a game out of many cubes and am planning on putting it on mobile platforms and also on the web using webgl. My problem is when I make a drawelements call per cube I take a hit on the frame rate. Is there a way I can make a single draw call to opengl es to draw them? The only difference between the cubes would be position and color.

Answer 1

I ran into same problem myself. I asked similar question and answered it myself yesterday. Take a look at:

Efficient way of drawing in OpenGL ES

You want to create your vertex buffers and upload them to graphics card memory only once using gl.bufferData. Then use reference to that buffer each time you do gl.drawElements or gl.drawArrays. Until the next time the content of your 3D scene changes, you can use this buffer that is uploaded in graphics card memory.

Answer 2

Follow the model of UITableView in how they dequeue cells. I would build an object that keeps track of objects you've drawn and links them to an Identifier. Then you can simply dequeue them with said identifier. If you know you're going to draw many versions of the same object, use that object to minimize rendering/allocations.

Answer 3

If you're using Vertex Arrays for your glDrawElements(), I'd suggest instead using Vertex Buffer Objects. This will store the data server side (in GRAM) instead of client side (in system RAM). That way you can make glDrawElements() calls with much less CPU<->GPU data transfer overhead.

Alternatively, you can store you're cubes in display lists. This way you could use glTranlate() to move a cube around and then just call the display list to render it. The only caveat to using display lists is that whatever you do in the display list is immutable; you can't change the calls in the display list without completely recompiling it.