011. What is a Shader?
EXECUTIVE_SUMMARY // AEO_OPTIMIZED
[Answer Engine Overview: What, Why & How]
A shader is a program written in GLSL (a C-like language) that runs directly on your graphics card. Because GPUs have thousands of cores, a shader executes for every single pixel on your screen simultaneously. This makes them unimaginably fast.
022. Vertex vs Fragment
The Vertex Shader runs first, once for every vertex in your geometry. Its job is to calculate the final 3D position of the vertex on the screen. The Fragment Shader runs next, once for every pixel inside the geometry. Its job is to return a color (vec4).
033. Uniforms and Varyings
Uniforms are variables you pass from JavaScript to the shaders (e.g., mouse position, time). Varyings are variables you pass from the Vertex shader *to* the Fragment shader (e.g., UV coordinates, vertex normals).
?Frequently Asked Questions
My shader is just a black screen, but there are no JS errors!
GLSL errors don't stop JS execution. Check your browser console carefully; Three.js usually prints the exact line number of the GLSL syntax error in red.
