Opengl es 如何创建多重停止渐变片段着色器？

我正在尝试创建一个OpenGL ES 2.0片段着色器，它沿一个轴输出多个停止梯度。它应该在以百分比定义的点处的多个颜色之间插值

我通过使用

if

s片段着色器实现了这一点，如下所示：

float y = gl_FragCoord.y;
float step1 = resolution.y * 0.20;
float step2 = resolution.y * 0.50;

if (y < step1) {
    color = white;
} else if (y < step2) {
    float x = smoothstep(step1, step2, y);
    color = mix(white, red, x);
} else {
    float x = smoothstep(step2, resolution.y, y);
    color = mix(red, green, x);
}

float y=gl_FragCoord.y；
浮动步长1=分辨率y*0.20；
浮动步长2=分辨率y*0.50；
如果（y

他们说片段着色器中的分支会破坏性能。是否有一些巧妙的技巧可以用来在多个值之间进行插值，而无需使用

if

s？这真的值得吗（我知道这是非常主观的，但作为经验法则）

---

为了说明我的问题，这个GLSL沙盒链接中的完整源代码（仍然很短）：

如果您想消除分支，您可以执行以下操作（取自Heroku）

---

但我根本不确定这是否比if/elses快。

这是我真正想要的答案！如果我有性能问题，我会对这些方法的性能进行基准测试。据我所知，GPU上的所有内核都希望在同一时间执行相同的操作。如果您有分支，则存在不同的内核需要执行不同操作的风险，因此一些内核实际上会被阻塞。这就是扼杀性能的原因。在着色器中避免分支确实是一种很好的做法。

color = mix(white, red, smoothstep(step1, step2, y));
color = mix(color, blue, smoothstep(step2, step3, y));
color = mix(color, green, smoothstep(step3, resolution.y, y));