@tuia/rip

    1.2.4 • Public • Published

    @tuia/rip

    用户行为记录、回放

    名字由来

    时间大师(Rip Hunter)是美国 DC 漫画旗下超级英雄,初次登场于《Showcase》第 20 期(1959 年 5 月)。本名理查德·“瑞普”·亨特(Richard “Rip ”Hunter),是金色先锋的儿子,也是一位时间旅行者,还是“时间之主”的一员,这个组织的目标就是要保护历史本身。

    这个库的目标:保护操作历史

    开发

    • npm run dev
    • npm link 到 demo 项目

    发布

    • npm run build
    • npm publish

    一:示例

    // 引入(npm install @tuia/rip)
     
    import rip from "@tuia/rip";
     
    // 注册
     
    // rip.init方法,其中system和userIdentifier是必要参数
     
    setTimeout(() => {
      rip.init({
        system: "测试数据", //system:string 必传,接入系统名称
        env: "prod", //env?:string 默认为prod ,可以传入dev仅作为测试使用
        log: true, //log?boolean 默认为false,不打开录制日志
        userIdentifier: JSON.stringify(userInfo), //userIdentifier:string 必传,当前用户信息。推荐json,包含email等用户信息
        path: location.hash, //path:string  默认取当前url,当前路由hash信息
      });
    }, 2000);
     
    // 销毁,页面跳转不需要调用。在不想监听或者整个App销毁时可以调用(正常场景下基本不会用到)
    rip.stop();

    二:你需要了解的

    初始化时机

    建议放在页面渲染稳定后,也就是用户可操作后再初始化。

    这是因为初始化时会对整个页面进行快照,这一部分数据量非常大,对此我们做了特别的优化。如果初始化时页面还是白屏或者页面内容在剧烈变化 ,这样全量快照小,而 diff 信息会很大,和我们的优化期望正好相反,当然 diff 信息过大的情况,我们也做了处理。总之,我们推荐的最佳实践是,在获取到用户信息(这个时必传参数)并且页面趋于稳定,用户可操作以后去初始化录制。这个具体到业务场景,需要做下权衡

    性能

    rip 的运行,除了一个探针监听用户行为并转发事件外,其他计算都在 Web Worker 中进行,包括数据维护,切分,上传等操作。不会对业务系统的性能造成太大影响

    接入成本

    rip 只有两个 api,init 和 stop。其他所有的边界操作都已经在这两个方法中处理掉了,基本实现了业务系统的零成本接入。

    三:数据网址

    测试数据网址:http://hunter.duibadev.com.cn/private#/userBehavior 线上数据网址:http://hunter.dui88.com/private#/userBehavior

    四:学习资源: https://github.com/rrweb-io/rrweb

    Install

    npm i @tuia/rip

    DownloadsWeekly Downloads

    40

    Version

    1.2.4

    License

    ISC

    Unpacked Size

    58 kB

    Total Files

    3

    Last publish

    Collaborators

    • dinglh
    • candy_dd
    • wintersun97
    • tump
    • inuanfeng
    • zhoucheng
    • zhangmin173
    • aiduck
    • chao.zhou
    • babalk
    • leitingting
    • sillyy
    • nbseven
    • linhao-vue
    • liusandy