@chromaui/rrweb-snapshot

中文文档
2.0.0-alpha.19-noAbsolute发布于 2026/04/27MITTypeScriptESM + CJS近 30 天下载 130.2万

rrweb的组件来拍摄 DOM 的快照, 也就是 DOM 序列器

中文使用文档
文档目录9 节
  1. API 密码
  2. 简介
  3. 发起人
  4. 黄金赞助商
  5. 银色赞助商
  6. 青铜赞助商
  7. 备份
  8. 核心小组成员
  9. 谁在用rrweb?

rrweb- snapshot 图像

Build Status Join the chat at slack

将 DOM 拍摄成一个状态和可序列的数据结构 . 另外,提供通过快照重建DOM的能力.

API 密码

此模块导出如下方法 :

简介

snapshot 将穿越 DOM 并返回能够代表当前 DOM 的状态和可序列的数据结构 视图。 。 。 .

在快照期间将做一些事情:

  1. 将一些 DOM 状态插入到 HTML 属性中,例如 HTML InputElement 的值.
  2. 将脚本标签转换为 noscript 避免脚本被执行的标记.
  3. 尝试内置样式表,以确保可以使用本地样式表 .
  4. 使href,src,CSS中的相对路径成为绝对路径.
  5. 给每个节点一个ID,并在快照完成后返回ID节点地图.

重建

rebuild 将会根据拍摄的快照构建DOM.

重建期间将做一些事情:

  1. 如果节点是元素,则添加数据驱动属性.
  2. 创建一些额外的DOM节点,如文本节点,以设置内置 CSS 和一些状态.
  3. 如果节点拥有一些额外的孩子DOM,则添加数据外孩子索引属性.

序列化 NodeWithId 软件

serializeNodeWithId 可将节点序列化为带有 id 的快照格式.

构建节点WithSN

buildNodeWithSN 从序列化节点建立DOM,并将序列化信息存储于 mirror.getMeta(node)。 。 。 .

发起人

成为提案国 并在Github的读取器上找到你的标志 链接到你的网站.

黄金赞助商

sponsor sponsor sponsor sponsor sponsor sponsor sponsor

银色赞助商

sponsor sponsor sponsor sponsor sponsor sponsor sponsor

青铜赞助商

sponsor sponsor sponsor sponsor sponsor sponsor sponsor sponsor sponsor

备份

核心小组成员


尤伊兹0112


云凤


eoghanmurray (英语)


果汁10号
为 rrweb 咨询打开

谁在用rrweb?

Smart screen recording for SaaS
The first ever UX automation tool Remote Access & Co-Browsing The open source, fullstack Monitoring Platform. Comprehensive data analytics platform that empowers businesses to gain valuable insights and make data-driven decisions.
Intercept, Modify, Record & Replay HTTP Requests. In-app bug reporting & customer feedback platform. Self-hosted website analytics with heatmaps and session recordings. Interactive product demos for small marketing teams

版本与发布记录

@chromaui/rrweb-snapshot 共发布 9 个版本,首次发布于 2023/04/06;过去 12 个月发布了 1 个版本。

版本发布日期距今
2.0.0-alpha.19-noAbsolutelatest2026/04/276 个月前
2.0.0-alpha.18-noAbsolute2025/05/151.5 年前
2.0.0-canary.18-noAbsolutecanary2025/05/141.5 年前
2.0.0-alpha.17-noAbsolute2024/09/252 年前
2.0.0-alpha.172024/09/132 年前
2.0.0-alpha.7-noAbsolute.22023/04/063 年前

关于 @chromaui/rrweb-snapshot 的常见问题

@chromaui/rrweb-snapshot 是什么?

rrweb的组件来拍摄 DOM 的快照, 也就是 DOM 序列器

如何安装 @chromaui/rrweb-snapshot?

在项目目录运行 npm install @chromaui/rrweb-snapshot,或使用 pnpm add / yarn add / bun add。

@chromaui/rrweb-snapshot 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@chromaui/rrweb-snapshot 支持 ESM 还是 CommonJS?

同时提供 ES Module 与 CommonJS 入口,import 和 require() 都可以使用,打包工具会自动选择合适的版本。

@chromaui/rrweb-snapshot 可以商用吗?

@chromaui/rrweb-snapshot 使用 MIT 许可。宽松许可:允许商业使用、修改和再分发,通常只需在分发时保留原版权与许可声明。以上为概括,不构成法律意见,请以许可原文为准。

@chromaui/rrweb-snapshot 的下载量有多少?

根据 npm 官方下载统计,@chromaui/rrweb-snapshot 在 2026/10/10 – 2026/11/08 这 30 天内被下载 1,302,383 次,日均约 43,413 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@chromaui/rrweb-snapshot 还在维护吗?

最新版本 2.0.0-alpha.19-noAbsolute 发布于 2026/04/27(6 个月前);至今共发布 9 个版本,其中过去 12 个月发布了 1 个;首次发布于 2023/04/06。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。