顶点着色器与片元着色器：区别与作用

渲染管线中的可编程阶段

在现代 GPU 渲染管线中，顶点着色器和片元着色器是两个主要的可编程阶段。顶点着色器处理每个顶点的数据（如位置、法线、UV），执行变换和光照计算；片元着色器处理每个片元（像素候选），计算最终颜色。两者通过光栅化阶段连接，光栅化将顶点数据插值为片元数据。

顶点着色器

顶点着色器是渲染管线的第一个可编程阶段，对每个顶点执行一次。其输入包括顶点属性（位置、法线、颜色、UV 等），输出变换后的顶点位置和传递给片元着色器的插值数据。

典型功能：

• **坐标变换**：将顶点从模型空间变换到世界空间、观察空间、裁剪空间。
• **法线变换**：处理非均匀缩放时的法线矩阵。
• **纹理坐标传递**：传递 UV 或计算特殊效果（如动画 UV）。
• **逐顶点光照**：简单光照计算（如 Gouraud 着色）。

顶点着色器无法创建或删除顶点，只能处理现有顶点。

片元着色器

片元着色器（也称像素着色器）对光栅化后的每个片元执行一次（实际可能因深度测试被丢弃）。其输入是从顶点着色器插值得到的数据（如 UV、颜色、世界位置、法线等），输出是片元颜色（可能包括深度）。

典型功能：

• **纹理采样**：从纹理贴图获取颜色。
• **逐片元光照**：计算更精确的光照（如 Phong 着色）。
• **颜色混合**：应用 Alpha 混合、雾效等。
• **后处理效果**：在全屏四边形上实现后处理算法。

片元着色器是性能关键，因为其执行次数远多于顶点着色器。

两者区别

| 特性 | 顶点着色器 | 片元着色器 |

|------|-----------|-----------|

| 执行单元 | 每个顶点 | 每个片元（像素） |

| 执行次数 | 较少 | 较多 |

| 输入 | 顶点属性 | 插值后的片元数据 |

| 输出 | 裁剪空间坐标、插值数据 | 片元颜色 |

| 常用功能 | 坐标变换、骨骼动画 | 纹理采样、光照计算 |

| 性能影响 | 通常较小 | 通常较大 |

协同工作示例

一个简单的着色器程序：

顶点着色器：

```glsl

#version 330 core

layout (location = 0) in vec3 aPos;

layout (location = 1) in vec2 aUV;

out vec2 vUV;

uniform mat4 uMVP;

void main() {

vUV = aUV;

gl_Position = uMVP * vec4(aPos, 1.0);

}

```

片元着色器：

```glsl

#version 330 core

in vec2 vUV;

out vec4 FragColor;

uniform sampler2D uTexture;

void main() {

FragColor = texture(uTexture, vUV);

}

```

顶点着色器变换顶点并传递 UV，片元着色器采样纹理输出颜色。

常见问题

为什么需要两个着色器？

因为 GPU 并行架构需要分离顶点处理和片元处理，以优化吞吐量。顶点着色器处理几何，片元着色器处理像素，各司其职。

可以在顶点着色器中进行纹理采样吗？

可以，但纹理采样通常需要片元级插值，顶点级采样会导致质量问题（如纹理走样），现代 GPU 支持顶点纹理采样但性能较差。

片元着色器执行次数一定多于顶点着色器吗？

通常是的，因为一个三角形覆盖多个像素，但有早期深度剔除等优化。

如何优化片元着色器性能？

减少纹理采样、避免复杂计算、使用 LOD、减少分支等。

几何着色器与它们有什么关系？

几何着色器位于顶点和片元之间，可以处理整个图元并生成新顶点，但现代渲染中较少使用。