DEV Community

Ben Halpern
Ben Halpern Subscriber

Posted on

rrweb: record and replay the web

This is a library for recording user activity and storing it as a replayable video of sorts.

This is similar to hotjar and similar services, but it's open source and seems more configurable. Inherently more configurable because you have the code.

GitHub logo rrweb-io / rrweb

record and replay the web

Try rrweb

rrweb

The rrweb documentary (in Chinese, with English subtitles)

Join the chat at slack Twitter Follow total gzip size recorder gzip size

δΈ­ζ–‡ζ–‡ζ‘£

I have joined Github Sponsors and highly appreciate your sponsorship.

rrweb refers to 'record and replay the web', which is a tool for recording and replaying users' interactions on the web.

Guide

πŸ“š Read the rrweb guide here. πŸ“š

🍳 Recipes 🍳

πŸ“Ί Presentation: Hacking the browser to digital twin your users πŸ“Ί

Project Structure

rrweb is mainly composed of 3 parts:

  • rrweb-snapshot, including both snapshot and rebuilding features. The snapshot is used to convert the DOM and its state into a serializable data structure with a unique identifier; the rebuilding feature is to rebuild the snapshot into corresponding DOM.
  • rrweb, including two functions, record and replay. The record function is used to record all the mutations in the DOM; the replay is to replay the recorded mutations one by one according to the corresponding timestamp.
  • …

Currently deemed not ready for production according to the README.

P.S. We started a new tag called GitHunt for posts like this one. Follow the tag if you like this sort of stuff. Of course, all are welcome to contribute a post as well.

#githunt

Interesting open source repos you've discovered and want to share with the community.

Happy coding! ❀️

Top comments (4)

Collapse
 
ben profile image
Ben Halpern

Of course, user privacy is one concern with tools like this. But I'd think of it as an issue for all analytics and not necessarily more so with this tool.

Performance is also a concern.

We tend to err on the side of caution in terms of data collection and performance, so probably wouldn't be something we'd use. But still an interesting tool and definitely great that it's open source.

Collapse
 
bgadrian profile image
Adrian B.G.

We got a real value from user recorded sessions, but payed ones, as in the user is recording its session and speaking out its mind. You learn a lot. We used a managed service for this but I forgot which one.

Just the record by itself is like having analytics, I dont see any extra value except the UX improvements.

Collapse
 
birigui profile image
b-irigui

I've been trying to implement this solution for 4 months, I've tried several ways, via node via javascript, I've tried using redis to store the events and I've even tried with docker, and I can't make it works...

Could someone create a step-by-step guide on how to implement it?
The documentation is very vague and I was unable to follow it.

Collapse
 
boudhayandev profile image
Boudhayan Dev

This is really amazing. There are lot of things one can learn from this. May I ask you, what kind of data structure you have used to store the user interactions ? Also how do you replay it from the collected data ?