Duplicating transform data on each vertex works better than what most people might think but it is wasting a lot of memory bandwidth. The time it takes to do gl.texSubImage2D is significantly less compared to the time it takes to calculate new world matrices for dynamic objects. The numerous uniformMatrix4f calls didnt help either. Batched uniforms should supposedly handle the draw call problem but I found too much CPU time is used on getting the matrix data from the right model and uploading it to GPU. Technique 1 fails just because its doing too many draw calls. I think its pretty obvious that uniform instancing is not the way the go. No draw, just CPU time to calculate the matrices: ~170000.Store transforms per vertex: ~40000 (found a bug with first implementation).Here is the results: (how many can be drawn at 60FPS) Hardware instancing is not considered as I assume the requirement is to draw many unique models even though for my test I am only drawing cubes that have a different world matrix every frame. Then at each frame, gl.texSubImage2D the entire texture and draw as many as possible in each draw call. Each model has a modelIndex attribute which is used to read its matrix from the texture. I created a Float32Array of size 4096 * 256 * 4 which contains the world matrix for every model (enough for ~256k models). The final technique is via texture lookup. On draw time, for each batch, upload matrix from the model at batch to the matrix array in the GPU and draw the batch. This is also how it is usually implemented in skeleton animations. This is similar to the first, except it allows models to be drawn in batches.

The third approach is to upload multiple matrix transforms as uniform to the GPU and have an additional matrixID on each vertex to select the right matrix on the GPU. On each draw, do gl.bufferSubData then draw as many models as possible in each draw. The second is to store an additional attribute, the matrix transform on each vertex and do transforms on the GPU.

For each model, set uniforms, then draw model. The first is instancing via uniform that you found in most tutorials and books. I was curious about this too so I run a couple tests with 4 different drawing techniques. You might find these WebGL tutorials helpful. vec2 packFloatInto8BitVec2(float v, float min, float max) Expand that to the number of bits you have and then break it into parts. If you know the max range of values you want to store, say +5 to -5, than the easiest way is just to pick some convert that range to a value from 0 to 1.

Vec2 pack