three.jsglslwebglcolor-space

WebGL - GLSL - What's the difference between vec3.rgb and vec3.xyz?

What is the difference between using .rgb and .xyz when dealing with a vec3 in a GLSL shader?

For example, in some examples I see .rgb:

void main() {
    vec3 color = vec3(1.0, 0.0, 0.0);
    gl_FragColor = vec4(color.rgb, 1.0); // <-- using color.rgb
}

But in other examples I see .xyz:

void main() {
    vec3 color = vec3(1.0, 0.0, 0.0);
    gl_FragColor = vec4(color.xyz, 1.0); // <-- using color.xyz
}
Solution

  • There is no real difference. They're "syntactic sugar" for referencing the same data.

    See: Data type "swizzling"