Command Palette

Search for a command to run...

Hectal
Back to the lesson: Topic 7.2 — Near, Far and the Depth Buffer
3D Web · Example 2 of 2

Six ways to see nothing

One renderer draws the same box six times with one thing changed each time. "draw calls: 1" with an empty screen means the box was sent but nothing of it could be seen.

The GPU decides what is in front with a depth buffer: one number per pixel. Those numbers are bunched up near the camera, so a tiny near and a huge far make surfaces flicker (z-fighting), and a wrong near or far makes objects vanish.

Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.

Ready for more? This phase has 3 hands-on exercises with automatic checks.

Practice questions

Write the code in the editor, run it, then open the model answer to compare.

01

Write smallestGap(near, far, d) for a 24-bit buffer and print it in millimetres for near 0.5 and far 200, at 5 m and 50 m.

02

A scene shows a bike 2 m away with near 3. Say what the screen shows and give the smallest change that fixes it.

Explain it without notes

01

Why does lowering near from 0.1 to 0.01 hurt depth precision, while raising far from 100 to 1000 hardly does?

02

A decal (a logo) lies flat on the bike's frame and flickers when the camera moves. List three ways to fix it.

Six ways to see nothing
Press Run to see the page.
idle

Console

Nothing logged yet.

Expected console output

fine: camera 3 m away        draw calls: 1, triangles: 12
near = 5 (box is closer)     draw calls: 0, triangles: 0
far = 2 (box is farther)     draw calls: 0, triangles: 0
camera inside the box        draw calls: 1, triangles: 12
box behind the camera        draw calls: 0, triangles: 0
box scale 0                  draw calls: 1, triangles: 12