What is this?
rrweb ('record and replay the web') is an open-source tool for recording and replaying users' interactions on a website — DOM-level session replay you embed in your own app, in the spirit of Fullstory or LogRocket.
rrweb ('record and replay the web') is an open-source tool for recording and replaying users' interactions on a website — DOM-level session replay you embed in your own app, in the spirit of Fullstory or LogRocket.Is it a hosted service or a library I add to my own site?It's a set of open-source libraries you add to a web app, not a SaaS: rrweb-snapshot, record, replay, and rrweb-player. A hosted backend called rrweb cloud is also now available.
It's a set of open-source libraries you add to a web app, not a SaaS: rrweb-snapshot, record, replay, and rrweb-player. A hosted backend called rrweb cloud is also now available.How do I get started recording a session?The README links to the rrweb guide for the full walkthrough; the first step is installing the rrweb package from npm into your web app and starting the recorder.
The README links to the rrweb guide for the full walkthrough; the first step is installing the rrweb package from npm into your web app and starting the recorder.Do I need my own backend to store the recordings?You need somewhere to store recorded sessions: rrweb cloud is a hosted option, and the roadmap lists a storage engine that deduplicates large numbers of sessions. Otherwise storage is your own build.
You need somewhere to store recorded sessions: rrweb cloud is a hosted option, and the roadmap lists a storage engine that deduplicates large numbers of sessions. Otherwise storage is your own build.Does it capture network requests like XHR and fetch?Not out of the box: capturing network activity (XHR, fetch, GraphQL) is only planned via a new plugin API, and a token-efficient AI session replay format is still in progress.
Not out of the box: capturing network activity (XHR, fetch, GraphQL) is only planned via a new plugin API, and a token-efficient AI session replay format is still in progress.So do I wire this into my own product — my users never see rrweb itself?Right: developers and product teams embed the recorder in their own web app and replay sessions on their side — the README lists monitoring, analytics and bug-reporting platforms built on rrweb.
Right: developers and product teams embed the recorder in their own web app and replay sessions on their side — the README lists monitoring, analytics and bug-reporting platforms built on rrweb.Does it work only for web pages, or can it record native apps too?Web only — it records the DOM of web pages in the browser and replays them there; rrweb-player is a web UI on top of the replay engine.
Web only — it records the DOM of web pages in the browser and replays them there; rrweb-player is a web UI on top of the replay engine.What does a recording actually capture?Recordings capture every HTML state change and user interaction on the page, so whatever is rendered or typed can land in the event stream; the replay side runs in a sandbox.
Recordings capture every HTML state change and user interaction on the page, so whatever is rendered or typed can land in the event stream; the replay side runs in a sandbox.How does the recording work under the hood?An initial snapshot converts the DOM and its state into a serializable data structure with unique identifiers, then rrweb records incremental mutations and user interactions as the user browses. Replay rebuilds the snapshot and plays back the event stream.
An initial snapshot converts the DOM and its state into a serializable data structure with unique identifiers, then rrweb records incremental mutations and user interactions as the user browses. Replay rebuilds the snapshot and plays back the event stream.Can one recording span multiple page loads?Yes — multiple page loads can be chained together into a single recording.
Yes — multiple page loads can be chained together into a single recording.Is there a ready-made player UI?Yes, rrweb-player — a GUI on top of the replay package with pause, fast-forward, and drag-and-drop to play from any point in time.
Yes, rrweb-player — a GUI on top of the replay package with pause, fast-forward, and drag-and-drop to play from any point in time.Can rrweb-snapshot be used on its own?Yes — it can produce a static HTML-based 'screenshot' of the current page state with all JavaScript deactivated, no recording needed.
Yes — it can produce a static HTML-based 'screenshot' of the current page state with all JavaScript deactivated, no recording needed.What are similar projects?ultrastorage, openreplay, classnames, velocity, better-scroll, partytown, ua-parser-js, anime
ultrastorage, openreplay, classnames, velocity, better-scroll, partytown, ua-parser-js, animeWhich topics is it in?session-replay, serialization, dom, debugging, analytics, sandbox, browser, monitoring, web-development, gui, npm, frontend
session-replay, serialization, dom, debugging, analytics, sandbox, browser, monitoring, web-development, gui, npm, frontend