@ domains/ 运行时间
Domlis的浏览器边上下文捕捉引擎.
@domscribe/runtime 当开发者点击一个元素时,在浏览器中运行并捕获组件道具,状态和DOM上下文. 它的核心是框架不可知性——适应者提供具体框架的行为.
安装
npm install @domscribe/runtime
框架支助
| 框架 | 适配器 | 捕获战略 |
|---|---|---|
| 反应 18-19 | @domscribe/react | 纤维行走, DevTools 钩子, 最佳努力 |
| 第3组 | @domscribe/vue | VNode 检查, 组成 + 选项 API |
| 下一个.js 15-16 | @domscribe/next | 反应适配器 + withDomscribe() 配置包装 |
| 纳克特 3+ | @domscribe/nuxt | Vue 适配器 + 自动配置 Nuxt 模块 |
对于大多数项目,您会安装一个框架适配器,而不是 @domscribe/runtime 直接说 适配器声明 @domscribe/runtime 作为同伴的依赖和处理初始化.
运行时间管理器
RuntimeManager 是管理活性适配器的单通,向覆被和其他内部消费者提供捕获API.
import { RuntimeManager } from '@domscribe/runtime';
const runtime = RuntimeManager.getInstance();
await runtime.initialize({
adapter: myAdapter,
phase: 1,
debug: false,
redactPII: true,
blockSelectors: [],
});
选项
| 选项 | 类型 | 默认 | 说明 |
|---|---|---|---|
adapter | FrameworkAdapter | NoopAdapter | 用于上下文捕捉的框架适配器 |
phase | 1 | 2 | 1 | 地物相相门. 第一阶段:道具和状态捕捉. 第2阶段:事件流量和业绩衡量标准(未来). |
debug | boolean | false | 启用调试日志 |
redactPII | boolean | true | 在捕获的数据中编辑敏感值(电子邮件、信使) |
blockSelectors | string[] | [] | CSS 元素在捕获时跳过的选择器 |
serialization | SerializationConstraints | undefined | 捕获道具和状态的序列限制(见下文) |
initialize() 能够安全地拨打多次——后续使用相同配置的呼叫是无操作的.
序列限制
运行时间对组件道具进行序列化,并有限制状态,以防止有效载荷尺寸过大. 所有字段都是可选的——默认由序列器应用.
| 选项 | 默认 | 说明 |
|---|---|---|
maxDepth | 6 (道具), 4 (状态) | 最大对象横向深度 |
maxArrayLength | 20 | 切换前的最大数组元素 |
maxStringLength | 2048 | 切换前的最大字符串长度 |
maxProperties | 50 | 每个对象的最大属性 |
maxTotalBytes | 262144 (256KB) (韩语) | 整个序列化产出的近似字节预算 |
当超过限制时,序列器会插入人可读的哨兵([Max Depth Exceeded], (中文(简体) ), [Truncated: size limit])和截取元数据({ __truncated: true, originalLength: N })所以特工们可以看到被省略的内容.
这些制约因素可通过下列途径对每个项目进行配置: serialization 选项 RuntimeOptions,所有框架适配器插件都通过它们的 runtime 名称空间.
Framewapter 接口
适应者执行 FrameworkAdapter 接口将运行时间连接到特定框架的内部组件模型.
interface FrameworkAdapter {
readonly name: string;
readonly version?: string;
getComponentInstance(element: HTMLElement): Nullable<unknown>;
captureProps(component: unknown): Nullable<Record<string, unknown>>;
captureState(component: unknown): Nullable<Record<string, unknown>>;
getComponentName?(component: unknown): Nullable<string>;
getComponentTree?(component: unknown): Nullable<ComponentTreeNode>;
getSerializationHints?(): SerializationHints;
}
串行提示
适应器可以执行 getSerializationHints() 以声明哪些对象键是框架内部,在序列化过程中应当跳过。 这使得框架管道(如回放纤维树,Vue反应标记)无法消耗字节预算.
interface SerializationHints {
skipKeys?: Set<string>; // Exact keys to omit (e.g., '_owner')
skipKeyPrefixes?: string[]; // Prefixes to omit (e.g., '__react' catches '__reactFiber$xyz')
}
反应适配器跳过 _owner, (中文(简体) ), _store,还有所有 __react* 键。 Vue 适配器跳过 __v_* 反应内相. 这个 NoopAdapter 返回不提示 —— 所有密钥都是序列化的 .
见 自定义适配器指南 用于完整的接口、实例和整合指示.
链接
部分 多写。 。 。 .
许可证
麻省理工学院