Hotjar

Promptfree, for everyone, and the only version there is

Open the prompt in Claude CodeOpen the prompt in CodexOpen the prompt in Cursor

Copy

Build me click and scroll heatmaps for my own site, plus a small on-page survey. Skip session replay.

STACK
- A vanilla JS collector under 4KB gzipped, no dependencies
- Node with Fastify, Postgres for storage
- Server-rendered dashboard

THE COLLECTOR
- Record: click coordinates relative to the nearest element with a stable selector, not to the page
- Record: maximum scroll depth as a percentage, sampled on unload
- Batch and send with sendBeacon; never block navigation
- Honour Do Not Track and a cookie-free first-party id that expires with the tab

WHY RELATIVE COORDINATES MATTER
- A page at 1440px and the same page at 375px are different layouts; absolute x,y averaged across both is noise
- Store selector plus offset within the element, then reconstruct per breakpoint bucket

THE HEATMAP
- Render on top of a screenshot the server takes itself with Playwright, at three widths
- Draw clicks as a density canvas, scroll depth as a horizontal band chart
- Say how many sessions the map is built from, and refuse to draw one under fifty

THE SURVEY
- One question, shown after a rule: time on page, scroll depth, or exit intent
- Answers stored append-only with the page and the breakpoint
- Never show it twice to the same visitor

PRIVACY, WHICH IS THE WHOLE RISK HERE
- No text content is ever captured, only geometry
- No IP stored; a country derived from it at most

Include a README on the storage cost per million clicks and how to regenerate the screenshots when the design changes.