Rendering

Render tree

DOM and CSSOM combined into a tree of only the nodes that will actually be painted, each with its computed style. Invisible nodes (display:none, <head>) are left out.

A display:none element is in the DOM but not the render tree.

DOM
p
head
CSSOM
p { color }
Render
Watch invisible nodes drop out

One of 40 cards in the JavaScript deck. Browse every card.