rrweb-io / rrweb

record and replay the web

Home Page:https://www.rrweb.io/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[Feature Request]: Optimization of Initial Full Snapshot in rrweb

zhanseitaliev opened this issue · comments

Preflight Checklist

  • I have searched the issue tracker for a feature request that matches the one I want to file, without success.

What package is this feature request for?

rrweb

Problem Description

The initial full snapshot creation in rrweb is resource-intensive, particularly on large and content-rich websites. This can cause significant performance degradation and user experience issues. Since the snapshot process is executed in the main thread, it can lead to a noticeable freeze of the webpage, affecting end-users directly. As the websites are quite large and cannot be modified for snapshot optimization, I am seeking a solution that minimizes the impact on the main thread during the initial snapshot process.

Proposed Solution

I propose an enhancement where rrweb could facilitate the serialization of the document's DOM into a string format that could be sent to the server. Once transferred, the server could handle the heavy lifting of snapshot creation and serialization. This would offload the initial resource-intensive operation from the client's main thread, potentially improving the overall performance and user experience. The server-side could use a headless browser or similar technology to reconstruct the DOM for snapshot purposes.

Alternatives Considered

  1. Incremental snapshot capturing to reduce the initial load, but this still affects the main thread during the first full snapshot.
  2. Delaying the snapshot until the page is less active, which is not always practical and can miss out on early user interactions.
  3. Offloading snapshot processing to a Web Worker, which is not feasible as Web Workers do not have access to the DOM.

Additional Information

This feature would be particularly beneficial for my use case, where the websites are complex and cannot be altered. Efficient initial snapshots are crucial for providing a seamless user experience without compromising on the functionality of rrweb. Any insights or additional solutions for this challenge would also be greatly appreciated.