Let's say, that I have 3 programs, and in each of those programs there is a view matrix uniform, which should be the same in all those programs.

Right now, when my camera moves, I need to re-upload the modified matrix to every program separately. Is it possible to create some kind of global uniforms which are constant for all programs linked to it, so I could just upload the matrix once?

I tried creating a globalUniforms object which looked kinda like this:

var globalUniforms = {
    program: {},
    // (...)
    vMatrixUniform: null,
    // (...)
    initialize: function() {
        vMatrixUniform = gl.getUniformLocation(this.program, 'uVMatrix');
    }
};

So I could just link it to proper programs like this: program.vMatrixUniform = globalUniforms.vMatrixUniform;, and then pass the matrix like this:

if (camera.isDirty.viewMatrix !== false) { camera.isDirty.viewMatrix = false;
    gl.uniformMatrix4fv(globalUniforms.vMatrixUniform, false, camera.viewMatrix.element);
}

but unfortunately it throws an error:

Uncaught exception: gl.INVALID_VALUE was caused by call to: getUniformLocation called from line 272, column 2 in () in mysite/js/mesh.js: vMatrixUniform = gl.getUniformLocation(this.program, 'uVMatrix');

Summing up: is there a more efficient way of managing shaders which follows my logic?