Scrimba.com interactive DOM recording algorithm

Question

I have recently taken a few courses on Scrimba and I am totally in love with the platform. Can anyone tell me how is this interactive DOM working? How is it being recorded? What's the algorithm to achieve this?

Answer 1

It's the secret sauce, but the long and short of it is the events DOM recording.

The basic idea behind Scrimba is that we record events instead of pixels. So what you're seeing when you're watching a Scrimba screencast is simply a re-creation of what the creator did when creating the screencast (which is done in-browser).

We record every click, mouse event, key event, etc, and then replay it.

Source: i'm a team member and here's Per talking about it https://news.ycombinator.com/item?id=14299979