Webrec records what happens in a session and replays it with the DOM reconstructed, not as video. Console output, network requests, and errors sit on the same timeline as the replay.
Errors collapse into groups by type and stack trace fingerprint, with occurrence counts and affected sessions. Every occurrence links to the replay at the moment it was thrown.
Rage clicks, dead clicks, and error clicks are counted per session as events arrive, and rage clicks can be filtered on directly.
Heatmaps, funnels, retention, and journeys run over the same recordings, so there is no second SDK to install.
Inputs are masked by default and text masking is opt-in.
Connecting a project writes one environment variable to it:
NEXT_PUBLIC_WEBREC_API_KEY is the project's public key. The browser SDK sends it with each event. It only writes to the project it belongs to, so it is safe to expose.
It is set on Production, Preview and Development. Leaving it off Preview means preview deployments record nothing, which is hard to trace back here.
Install the SDK and initialise it:
npm install webrec
import WebRec from 'webrec';
WebRec.init({ apiKey: process.env.NEXT_PUBLIC_WEBREC_API_KEY });
Redeploy for the variable to take effect. Disconnecting a project deletes the variable webrec created and nothing else.