webgl：未传递给着色器的变量会导致魔术？

Question

表示三角形的顶点数组永远不会通过 getAttribLocation / vertexAttribPointer 传递给顶点着色器。但是，三角形仍然会在屏幕上绘制。三角形是怎么画的。在着色器中，我指定了 vec2 pos，但我从不使用 getAttribLocation。 vec2 位置是 GLSL 中的保留值吗？ ：

function createShader( str, type ) {
  var shader = gl.createShader(type);
  gl.shaderSource(shader, str);
  gl.compileShader(shader);

  return shader;
}

function createProgram(vstr, fstr) {
  var program = gl.createProgram();
  var vshader = createShader(vstr, gl.VERTEX_SHADER);
  var fshader = createShader(fstr, gl.FRAGMENT_SHADER);
  gl.attachShader(program, vshader);
  gl.attachShader(program, fshader);
  gl.linkProgram(program);
  return program;
}
  
var c = document.getElementById('c');
var gl = c.getContext('experimental-webgl');
var vertexPosBuffer = gl.createBuffer();

gl.bindBuffer(gl.ARRAY_BUFFER, vertexPosBuffer);
var vertices = [ -0.5, -0.5, 0.5, -0.5, 0, 0.5];
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);

var vs = 'attribute vec2 asdf;' +
         'attribute vec2 pos;' +
         'void main() { gl_Position = vec4( pos, 0, 1 ); }';

var fs = 'precision mediump float;' +
         'void main() { gl_FragColor = vec4(0,0.8,0,1); }';

var program = createProgram(vs,fs);
gl.useProgram(program);

//
function animate () {
  gl.enableVertexAttribArray(0);
  gl.vertexAttribPointer( 0, 2, gl.FLOAT, false, 0, 0 );
  gl.drawArrays(gl.TRIANGLES, 0, 3);

  window.requestAnimationFrame(animate);
}

animate();

canvas { border: 1px solid black; }

<canvas id="c"></canvas>

Answer 1

GL 将为每个属性分配位置，无论您是否查询它们。但是，您只有一个活动属性，因为asdf 没有任何效果，将被优化掉。所以很有可能（但不能保证）pos 最终成为属性0。

即使使用了asdf，它仍然有可能最终成为0，因为属性名称和位置之间的映射完全是特定于实现的。

建议当然是：不要那样做。要么自己通过glBindAttribLocation 分配位置（在链接程序之前），要么查询 GL 分配了什么，否则行为会因每个实现而异。