Tracking user actions in real time?

Question

Analytics

How to track user actions in real time (ala screen viewing through teamviewer) through a browser, in general, what technologies is this based on?
I saw that this is implemented, here on this project
https://www.figma.com
What you eat there in real time you see how the designer walks around the layout, creates layers, you see his cursor, etc.
UPD: It means to view through the browser not the user's desktop, but the site on which the client walks ...

Answer 1

We track dom changes on the page via
https://developer.mozilla.org/en/docs/Web/API/Muta...
send them (as well as the cursor position, the current element in focus, the current scroll, and probably something else, which doesn’t immediately come to mind) via webrtc
https://github.com/feross/simple-peer
https://github.com/peers/peerjs
If the size of the data packet is too large, you can try to reap them via https:// github.com/nodeca/pako

Answer 2

This is tracked as follows - a DOM snapshot is created, then mouse movements are simply tracked, they are sent to the server using Ajax or its analogues. The web visor in Yandex.Metrica works like this.

Answer 3

On Windows, this can be done via RDP and shadow.
I think it works the same way in the browser.

Answer 4

Through AJAX - requests, I suppose

Answer 5

I understand that this should be done on your site?
If yes, then I would start from a simpler solution than you gave in the example site.
I would run a script on the client side, for example, once every 5 seconds. Which will take a screenshot of what is happening with the user.
The mouse will not be visible, but what he enters in the forms and so on will be visible.
The screenshot that will be taken will be saved somewhere and then viewed.
Of course, there is a minus here, in that a huge amount of space on your server will go away.
But this is the easiest option, although not the most successful.