Menu
I'm trying to create an OpenGL ES 2.0 fragment shader that outputs multiple stop gradient along one axis. It should interpolate between multiple colors at points defined in percents.
I've achieved this by using ifs the fragment shader, like this:
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);
}
They say that branching in fragment shader can kill performance. Is there some clever trickery that can be used to interpolate between many values without using ifs? Is it actually worth it (this is highly subjective, I know, but as rule of thumb)?
To illustrate my problem, full source (still short though) in this GLSL Sandbox link: http://glsl.heroku.com/e#8035.0
324
Unless you have early depth testing enabled, a fragment is only discarded after you run the fragment shader. In this case, the frag shader would run once for every fragment in both quads, so 20000 times.
A vertex shader receives its input data from a vertex attribute. But how does a fragment shader gets its data? Data is passed from shader to shader by using the in and out keywords. You create an output shader variable by using the out keyword.
A Fragment Shader is the Shader stage that will process a Fragment generated by the Rasterization into a set of colors and a single depth value. The fragment shader is the OpenGL pipeline stage after a primitive is rasterized. For each sample of the pixels covered by a primitive, a "fragment" is generated.
Fragment shaders Fragment (or texture) shaders define RGBA (red, green, blue, alpha) colors for each pixel being processed — a single fragment shader is called once per pixel. The purpose of the fragment shader is to set up the gl_FragColor variable. gl_FragColor is a built-in GLSL variable like gl_Position .
If you want to eliminate branches you can do following (taken from Heroku);
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));
But I'm not sure at all whether this is any faster than if/elses or not.
134
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
