user1109536
user1109536

Reputation: 107

How to optimize a color gradient shader?

I have created this simple fragment shader for achieving a vertical color gradient effect. But I find this to be taxing for my mobile device in full screen.

is there any way to optimize this?

here is the link to the code

http://glsl.heroku.com/e#13541.0

Upvotes: 1

Views: 9152

Answers (1)

vallentin
vallentin

Reputation: 26197

You could do something like this instead.

vec2 position = (gl_FragCoord.xy / resolution.xy);

vec4 top = vec4(1.0, 0.0, 1.0, 1.0);
vec4 bottom = vec4(1.0, 1.0, 0.0, 1.0);

gl_FragColor = vec4(mix(bottom, top, position.y));

Example

You can further change the color yourself, I just used random colors.


You can even further eliminate calculating the x but that's kinda overkill.

vec4 top = vec4(1.0, 0.0, 1.0, 1.0);
vec4 bottom = vec4(1.0, 1.0, 0.0, 1.0);

gl_FragColor = vec4(mix(bottom, top, (gl_FragCoord.y / resolution.y)));

Upvotes: 3

Related Questions