Show HN: Open source JavaScript library to record and replay the web

Since I've seen some people are talking about the open source idea and comparing rrweb to some commercial products, I'd like to share a blog post about the vision of rrweb.

http://www.myriptide.com/rrweb-introduction/

Also, you will know about how rrweb works in this post.

Nice way would be to do some recording for a week or so. Get any sessions that obviously were quite long and the user didn't achieve anything. Go through them and try improving UX so the user won't get stuck there the next time.

Has this been normalised? Is this the new default?

Food for thought.

https://www.userlook.co

May consider switching and using your library!

Thanks for sharing this :)

Very good work. I am actually a little surprised something like this is open source.

Few years ago, I created something very similar when working for validately.com - user testing company. The solution was tailored for our needs and was quite unique and rather sophisticated.

Below few main points:

- automatic injection of recording script by proxing original site / app via our domain (optionally user's could have inject the script by themselves)

- using iframe to serve the recorded page in order to preserve context and allow to display content on top of the page

- audio recording

- broadcasting in real-time

- storing all assets from a recording (images / stylesheets) to make playing back independent from original urls

Not everything was perfect and there were always something to improve. Some sites did not work at all due to technical limitations. But the technology was good enough so the company could grow and transit to webrtc based solution.

I am very grateful for this rare opportunity as the project taught me insane amount of useful stuff. Would love to work on something similar again.

For example,

A table and interacting with a table, the cells would just be filler elements. Form field data just wouldn't be captured, contents unique to any record on a page would be filled with sample data.

That way you get to see how someone interacts with a page, but not any context/personal information.

I think relying on sensible defaults or redacting data is a lost cause and puts the trust/responsibility in the wrong hands. Some companies may care about redaction while others don't prioritize it.

[1]: https://docs.heapanalytics.com/docs/using-identify

I mean, come on, how smooth is this library?

I checked the DOM of a angularjs app and when I enter something in the input field, its not appearing in the DOM at all.

However, as a session replay industry competitor and a former security researcher for most industry players, I caution anyone thinking of using a side-project like this on production applications to proceed slowly with care.

Security and Privacy are extremely hard to get right here. The tricky thing about session replay analytics is that attackers have a huge attack vector, and compromise means gaining a treasure trove of all user data. The nature of replay is in a way a form of XSS. Modern security features help (like CSPs, iframe Sandbox attribute) but browser changes can cause issues.

Some of the challenges: - CSPs can often be bypassed using Google API libraries, <Object/>, <SVG> - Blacklisting <SCRIPT/> tags can often be bypassed with an XML namespace - CSS based data or password exfiltration. - Clickjacking, "data:" urls etc. - Could you imagine a web request proxy server deploying Service Workers? - postMsg() from further nested frames

Substantial work goes into sandboxing replay environments and limiting PII. Defense in depth is particularly important here. Enterprise level research, auditing, monitoring and care should be taken seriously.