用途：用于在 WebGL、Three.js 或游戏引擎中编写自定义视觉效果、优化图形渲染性能、实现模糊/泛光/色彩校正等后处理，以及在 GPU 上程序化生成纹理或几何。
主要能力：梳理渲染管线中顶点着色器（负责将三维坐标变换到屏幕空间并写入 gl_Position）与片元着色器（负责逐像素着色，写入 gl_FragColor）的分工；说明 uniform（由 CPU 传入、对所有顶点或片元恒定的数据）与 varying（从顶点着色器插值传递到片元着色器的数据）的用法；介绍向量 swizzling，如 color.rgb、color.zyx 的取分量与重排；并给出基于 SDF 球体的简易 raymarching 示例。
使用方式：资料提供分步说明。第一步理解顶点与片元结构，示例中使用 attribute vec3 position、uniform mat4 modelViewMatrix、uniform mat4 projectionMatrix，并在 main 中计算 gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0)。第二步通过 varying vec2 vUv 在顶点着色器中赋值 vUv = uv，在片元着色器中据 UV 生成渐变。第三步使用向量分量访问与重排。
实践建议：用 mix() 做线性插值，用 step() 和 smoothstep() 做阈值与柔边以替代分支，尽量把数据打包进 vec4 以减少内存访问；避免在循环中使用重分支，避免在着色器内计算常量，应改为 CPU 预计算并通过 uniform 传入。
排查与限制：着色器编译成功但黑屏时，可检查 gl_Position.w 是否为 1.0、宿主程序是否真正设置了 uniform、UV 是否在 [0, 1] 范围内。该技能只适用于与其范围明确匹配的任务，输出不能替代针对具体环境的验证、测试或专家审查；若缺少必要输入、权限、安全边界或成功标准，应停下来请求澄清。资料未提供安装命令、平台支持范围与收费信息。