I want to make a WebGL 2D game with many sprites But I only have two triangles to make a square. And I do not need additional vertices. The following tutorials will help you understand my purpose

https://webgl2fundamentals.org/webgl/lessons/webgl-drawing-without-data.html https://webgl2fundamentals.org/webgl/lessons/webgl-instanced-drawing.html

Only one square and lots of matrices to move the square

My Shader

#version 300 es
    
uniform mat3 u_matrix;
uniform mat3 u_view;
uniform mat3 u_uv;
  
out vec2 v_texcoord;
     
const float xp[6] = float[](0.0, 0.0, 1.0, 1.0, 1.0, 0.0);
const float yp[6] = float[](0.0, 1.0, 0.0, 1.0, 0.0, 1.0);
    
void main() {
    float x = xp[gl_VertexID];
    float y = yp[gl_VertexID];
      
    gl_Position = vec4(u_view * u_matrix * vec3(x, y, 1),1);
    v_texcoord = vec3(u_uv * vec3(x,y,0)).xy;
}

My Code in each frame

gameobgects.forEach(gameobject => {
    gl.uniformMatrix3fv(u_uv, false, gameobject.uv);
    gl.uniformMatrix3fv(u_matrix, false, gameobject.matrix);
    gl.drawArrays(gl.TRIANGLES, 0, 6);
});

I can only change the value u_matrix once in each draw call with this shader

Help me to fix my shader. to connect u_matrix to a buffer and draw all objects in one call.

Forgive me for my bad English