首页 > 编程知识 正文

数据埋点,前端代码埋点实现步骤

时间:2023-05-03 16:08:08 阅读:26775 作者:478

写在前面的话:

最近,为了统计用户的喜好,需要进行用户行为的统计。 找到了介绍的比较完整的博客。

这是必须的考试问题。 我很容易记住。 我建议阅读原文:

原文链接

1 .前端监视的目的是(1)数据监控

数据监视顾名思义就是监听用户的行为。 常见的数据监控包括:

PV/UV:

PV(pageview )是页面浏览数或点击数。

UV:是指访问某个站点或单击某个新闻的不同IP地址的人数。 每个页面的停留时间用户都知道通过哪个门户访问该页面的用户在相应页面上触发的行为。 ***Ps:***汇总这些数据是有意义的。 例如,如果知道用户的来源,就可以促进产品的普及。 另外,如果知道用户在各页面停留的时间,就可以应对较长的页面,或者推送广告

(2)性能监控

性能监控是指监控前端性能,主要包括监控产品在网页和客户端的体验。 常见的性能监视数据包括:

按用户、机型、按系统列出的顶级屏幕加载时间响应时间整个静态资源的下载时间页面渲染时间页面交互式动画结束时间***Ps:***这些性能的监测结果是例如,与低版本的浏览器的动画效果的互换性、顶部画面加载的高速化等。

(3)异常监控

另外,产品的前置代码在执行中也会发生异常,因此需要引入异常监视。 及时的异常事态报告可以避免在线故障的发生。 大部分异常可以通过try catch捕获,但例如内存泄漏和其他偶发异常难以捕获。 需要监测的常见例外情况包括:

Javascript异常监测模式丢失异常监测2 .目前常见的前端嵌入方法有三种: (1) 代码埋点

代码嵌入点是指以嵌入代码的形式进行嵌入点。 例如,如果需要监视用户的单击事件,则可以在用户单击时插入代码,然后选择是保存监听行为,还是以某种数据格式直接将监听行为传递给服务器端。 另外,例如在需要统计产品的PV和UV的情况下,需要在网页初始化时发送用户的访问信息等。

代码嵌入点的优点:

可以随时准确发送或保存所需的数据信息。缺点:

工作量很大,需要为每个组件的嵌入点添加适当的代码

(2)可视化埋点

通过可视化交互手段,填补点来代替代码。 分离业务代码和嵌入点代码,提供可视交互的页面,作为业务代码输入。 通过该可视化系统,可以在业务代码内添加可定制的嵌入点事件等,最终输出的代码将业务代码和嵌入点代码结合起来。

可视化点听起来很高,但实际上与代码嵌入点相差不大。 也就是说,在一个系统中实现手动插入代码嵌入点的过程。缺点:

嵌入点的控件对于可视化嵌入点很有限,不能手动自定义。

(3)无埋点

没有嵌入点并不是说不需要嵌入点,而是在所有嵌入点上,都会标记前端的某个事件,防止记录所有事件。 定期上传日志文件,并结合文件分析,分析我们想要的数据,生成可视化报告供专家分析,从而实现“无嵌入点”统计。

从语言层面实现无嵌入点也很容易。 例如,在页面的js代码中,找到dom上绑定的事件,然后进行所有嵌入点。优点:

由于收集了大量数据,因此在产品迭代过程中无需关注嵌入点逻辑,也不会出现嵌入遗漏、错误嵌入等现象缺点:

在没有嵌入点的情况下收集全部数据,对数据传输和服务器造成压力

无法灵活地定制每次事件上传的数据

作者:于小良链接: https://juejin.im/post/5b 62 d 68d f 265 da 0f9d1a1CD 6

来源:掘金版权归作者所有。 商业转载请联系作者取得许可。 非商业转载请注明出处。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。