Is updating the entire VBO on every frame the most efficient way to draw many changing unique triangles?

Question

Answers my previous question , suggested that I use the vertex buffer object and combine my location data with my color data into one array, which I now made into this simple test example:

http://jsfiddle.net/headchem/r28mm/14/

Pseudocode for each frame:

function drawFrame() {
    // clear global vertex[] array containing both position and color
    // recreate it with new triangles and colors (determined elsewhere)
    drawShapes();

    // put the vertex array into the VBO using gl.bufferData
    // finish with a single call to gl.drawArrays(gl.TRIANGLES, 0, numItems);
    render();
}

I know that there is no silver bullet, but for my purpose of creating a screen, completely changing unique triangles, is this the most effective way? Does bufferSubData take any advantage over bufferData?

, 800 , . , , ? , , 50k - , ? api 1500 - - WebGL, api ?

Answer 1

, JavaScript. , , :

convertedVerts = convertedVerts.concat(getConvertedVerts(pxVerts, zIndex, color));

: O (n ^ 2), n - , , , .

, Firefox Safari (Chrome, , , , , ):

convertedVerts.push.apply(convertedVerts, getConvertedVerts(pxVerts, zIndex, color));

getConvertedVerts , , .

, , , Float32Array , ( ) . Float32Array s, , .

(, rgba(), ) - - , , .