Basics

  • shader language has a single main that returns color at the end
  • final pixel color is assigned to gl_FragColor
  • C-flavored language has built in variable, function, type
  • preprocessor macros (pre-compiled)
    • #define global variable
    • #ifdef and #endif
  • lower precision → faster rendering, less quality
    • precision medium float
    • precision lowp float
    • precision highp float
  • GLSL specs doesn’t guarantee auto-cast
    • vec4(1, 0, 0, 1) will raise error, because it’s not float
  • multiple ways of constructing vec4
    • vec4 color = vec4(vec3(1., 1., 0.), 1.);

Uniform & Varying

  • GPU has multiple threads calculating a portion of the color, each parallel thread is blind to others. The input sent from CPU to GPU are equal and read only to all the threads. These are uniforms.
  • supported type: float, vec2, vec3, vec4, mat2, mat3, mat4, sampler2D, samplerCube
  • uniforms are defined on the top of the shader after the point precision assigning.
#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 u_resolution; // canvas size (width, height)
uniform vec2 u_mouse; // mouse position in screen pixels
uniform float u_time; // TIme in seconds since load
  • GPU hardware has accelerated angle, trigonometric, and exponential functions
    • sin(), cos(), tan(), asin(), acos(), atan(), pow(), exp(), log() …
  • gl_FragColor is the default input. It holds the pixel coordinates of the pixels or screen of fragment that the active thread is working on. It’s not a uniform, because threads have it differently, it’s a varying. A varying variable contains data shared from vertex shader to a fragment shader.