SHADERS, 2001

What you will do

1. push the reference image through a fragment shader you can read ref

   Before 2001 the route from a texture to a pixel was fixed function: you set combiner state and the hardware chose the arithmetic. Here that arithmetic is nine lines of source.

2. see which stages you program and which stay fixed pipeline

   Vertex stage, rasteriser, fragment stage. The rasteriser is still fixed hardware today; the two programmable ends are what shipped in 2001.

3. read the vertex shader that feeds every fragment here vert

   NVIDIA announced the GeForce 3 in February 2001 with the first programmable vertex stage on a consumer card: up to 128 instructions per vertex and no branching at all.

4. trace how v_uv gets from the vertex stage to the fragment stage varying

   A varying is written once per vertex and read once per fragment, interpolated in between. No fragment can read its neighbour, which is precisely why the work parallelises.

5. print the fragment buffer with line numbers list

   DirectX 8, released in November 2000, defined the shader models the 2001 hardware ran: vertex shader 1.1 and pixel shader 1.1, written as assembly with hard instruction budgets.

6. load the simplest fragment shader there is frag uv

   A fragment shader has one required output, a colour. Everything else it needs it either receives as a varying or computes from scratch.

7. hand the source to the driver and link a program compile

   Shaders compile inside the graphics driver at run time, not in your build. The same source on two vendors' cards becomes two different machine codes.

8. start the frame loop and watch u_time drive the colour run

   u_time is a uniform: one value the CPU writes before a draw call, identical for all 76800 fragments in that call.

9. halt the loop and leave the last frame on the glass stop

   A framebuffer keeps whatever was written to it until something writes again. Stopping the loop does not clear the screen.

10. load a shader that draws a circle from a distance, not from geometry frag circle

    length(p) - r is already a distance field: positive outside the circle, negative inside, zero on the edge. The whole shape is that one expression.

11. build the circle shader compile

    step(0.0, d) returns 0 or 1 with no branch, and mix() picks between two colours with it. Branch-free selection was the habit of an era whose hardware had no branches.

12. resize the circle without touching the source uniform k 0.35

    Uniforms are the CPU's only channel into a linked program. Changing one is a driver call; changing a line of source is a recompile.

13. list the uniforms and see which ones survived compilation uniforms

    A uniform the compiler finds unused is stripped from the program, so getUniformLocation can return null for a name that is plainly there in the source.

14. break line 11 on purpose: drop the comma inside vec4 set 11 gl_FragColor = vec4(col 1.0);

    Nothing validates an edit at the moment you make it. The buffer is text, and stays text, until a compiler reads it.

15. read a real GLSL compiler error, from the driver, about your line compile

    That text came from the driver's own compiler, not from this page. The number after the first colon is the line in your fragment source.

16. put the comma back set 11 gl_FragColor = vec4(col, 1.0);

    A failed link leaves the previous program in place, which is why the monitor kept showing the last good frame instead of going black.

17. confirm the fix links cleanly compile

    Compile and link are two steps: each shader compiles alone, then the pair is linked and the varyings on both sides must agree in name and type.

18. append a line and prove what the compiler ignores add // end of shader

    Comments and whitespace cost nothing at run time. They are gone before the compiler emits a single instruction.

19. rebuild with the comment on the end compile

    GLSL ES 1.00, the dialect here, needs an explicit precision for floats in the fragment shader — that is the first line of every preset in this buffer.

20. load three summed sine fields, the demoscene plasma frag plasma

    Cg, released by NVIDIA in 2002, was the first widely used C-like shading language for these chips. Microsoft shipped HLSL with DirectX 9 that December.

21. build the plasma compile

    The same plasma in 1993 was a palette-cycled lookup table on the CPU. Here it is transcendental maths run per pixel, per frame, and the GPU does not notice.

22. let u_time animate it run

    GLSL became part of core OpenGL in version 2.0, September 2004. WebGL 1.0 uses its embedded dialect, GLSL ES 1.00, which is what this shader is written in.

23. stop the loop before moving to 3D stop

    Each frame is one draw call of six vertices and one fragment shader invocation per pixel. Nothing is cached between frames; the image is rebuilt from the maths every time.

24. learn signed distance functions and sphere tracing sdf

    John C. Hart published sphere tracing in 1996: step along the ray by exactly the distance the field says is safe, and you can never tunnel through a surface.

25. load a 3D scene with no vertices in it at all frag raymarch

    Nothing in this shader describes a sphere as geometry. The scene is one function, length(p) - 1.0, evaluated along a ray per pixel.

26. build the raymarcher and see a sphere with no shading compile

    A flat colour tells you the ray hit something and nothing more. With no term that varies across the surface, a sphere and a disc look identical.

27. walk the shading languages from 1999 to 2013 history

    Shadertoy, launched in 2013 by Inigo Quilez and Pol Jeremias, made the one-fragment-shader-no-geometry sandbox a public format. This terminal is running the same idea.

28. write the lambert term into the marked line light

    Lambert's cosine law, published by Johann Heinrich Lambert in 1760, says a matte surface looks brightest facing the light and fades with the cosine of the angle away from it.

29. build the shaded raymarcher compile

    The normal comes from the distance field itself: sample it a fraction either side of the point along each axis and normalise the three differences. Six extra map() calls, no stored normals.

30. Boss missionrun the lit raymarcher — sphere shaded by dot(n, L), verified by reading three pixels back off the GPU run

    Ray origin, ray direction, a distance function, a normal from central differences and one cosine: that is a lit 3D scene in 37 lines, with not a single triangle submitted.

Certificate

Nearby eras

All 25 eras in the Terminal Academy