问题描述
跟踪鼠标移动/滚动/点击事件很简单，但他们如何保存屏幕并使其保持同步？
Tracking mouse movement/scroll/click events is easy but how do they save the screen and keep it in sync so well?
页面呈现得非常好（至少对于静态HTML页面，尚未在Angular或任何SPA上测试过），同步几乎是完美的。
The pages are rendered very quite well (at least for static HTML pages, haven't tested on Angular or any SPA), the sync is almost perfect.
生成并上传23fps的屏幕录像（1920x1080）它需要大约2Mbps的带宽。也许只有当有一些鼠标事件录制时，它仍然需要平均300-500Kbps？这似乎太过分了......
To generate and upload a 23fps recording of my screen (1920x1080) it would take about 2Mbps of bandwidth. Maybe when recording only when there are some mouse events it would still take some 300-500Kbps on average? That seems way too much...
推荐答案
HTML内容和DOM更改通过websocket抽取并由Hotjar存储（减去敏感来自用户的表单输入等信息，除非你已将它们列入白名单），CSS不会被存储（当你观看录制时它会被你加载）。
HTML content and DOM changes get pumped through a websocket and stored by Hotjar (minus sensitive information such as form inputs from the user, unless you've whitelisted them), the CSS isn't stored (it gets loaded by you when you watch the recording).
因为它们只记录用户活动和DOM更改，所以要记录的数据要少于捕获完整视频的数据。缺点是一些Javascript驱动的小部件在重播中无法正常运行。
Because they're only recording user activity and DOM changes, there's a lot less data to record than if they were capturing a full video. The downside is that some Javascript driven widgets won't function correctly in the replay.
来自Hotjar文档的相关信息：
Relevant information from Hotjar docs:
来源：
这篇关于HotJar如何生成他们的录音？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！