Heatmap
A heatmap is an aggregate visualization that overlays interaction density, such as clicks, moves, or scroll reach, onto a page screenshot or rendering, with warmer colors marking higher activity. It compresses thousands of sessions into one picture of where attention and interaction concentrate.
How it works
Click maps aggregate interaction coordinates or target elements. Element-based aggregation can handle responsive layouts better than raw coordinates, but it needs an identity that remains stable across recordings, such as a deliberate data attribute or a normalized selector. rrweb mirror node ids identify nodes inside one recording and cannot join the same element across sessions. Move maps aggregate cursor positions as a weak proxy for attention, while scroll maps aggregate depth. Stored event streams contain the underlying clicks, moves, and scrolls, so a processing job can derive these views later. The background rendering also needs a representative page version because layouts and content change over time.
Where you encounter it
Page-level UX analysis and stakeholder communication, where a heatmap makes an argument a table cannot; the per-session complement is watching the replays behind a hot spot.