WebGL索引与非索引几何的顶点变换及顶点着色器管线相关疑问

嘿，我来帮你把这个问题掰扯清楚～

不管是索引还是非索引几何，顶点变换的核心逻辑都是在顶点着色器中完成的——简单说就是把顶点从局部空间，通过模型、视图、投影矩阵（也就是常说的MVP矩阵）一步步转换到裁剪空间，输出给后续管线阶段。两者的差异主要体现在顶点的复用和着色器调用次数上：

非索引几何（Non-indexed Geometry） #

• 你提交的是一份允许重复但不做复用的顶点数组，数组里的每个顶点，哪怕是和其他顶点完全一样的，都会被单独传入顶点着色器执行一次完整的变换流程。
• 举个例子：画一个矩形如果用非索引方式，你得传6个顶点（对应两个三角形），每个顶点都要跑一遍顶点着色器的变换逻辑，输出对应的变换后位置。
• 总结：数组里有多少个顶点，就调用多少次顶点着色器，每个顶点独立完成变换。

索引几何（Indexed Geometry） #

• 你需要提交两份数据：一份去重后的顶点数组，加上一份索引数组。GPU会根据索引数组的指向，去顶点数组里取对应的顶点来使用。
• 这里的关键就是你提到的顶点着色器输入不变性：如果同一个顶点被索引多次（比如矩形的两个三角形共享2个顶点），只要这个顶点的所有输入属性（位置、法线、纹理坐标等）完全一致，GPU就只会执行一次顶点着色器变换，把结果缓存起来，后续再用到这个索引对应的顶点时，直接复用缓存好的变换结果，不用再重复计算。
• 这也是索引几何能提升性能的核心原因之一——大幅减少了重复的顶点着色器调用次数，尤其是在有大量共享顶点的复杂3D模型中，性能提升会非常明显。

你提到的两个知识点其实是完全呼应的：

管线概述中提到顶点着色器在图元装配阶段之前运行

没错，顶点着色器是管线中第一个处理顶点数据的阶段，它会逐个处理顶点，输出变换后的顶点数据（位置、颜色、纹理坐标等），之后才会进入图元装配阶段，把这些顶点组装成三角形、线段之类的图元。

顶点着色器（通常）具有输入不变性，即在单个绘制命令中，两个接收到完全相同输入属性的顶点着色器调用将返回二进制完全相同的结果

这个特性正是索引几何优化的基础。GPU会利用这个不变性实现顶点结果缓存，同一个顶点（输入属性完全一致）在单个绘制命令内只计算一次变换，后续索引调用直接复用缓存值——既节省了计算资源，也能保证同一个顶点的变换结果绝对一致，不会出现多次计算产生微小差异的问题。

要注意的是：这个“输入不变性”的缓存只在单个绘制命令内有效，跨绘制命令的话，GPU不会保留之前的缓存，同一个顶点在不同绘制命令里还是会重新执行变换。

内容的提问来源于stack exchange，提问作者pailhead