前端性能监控

简介：统计页面的请求各项指标

指标

iswebview 判断在不在app里面

监控某些资源的加载时间

使用指南

script mode

<script src="../dist/performance-tracker.js"></script>

<script>
  performance.config({
    name: 'example_site'
    url: 'https://xxx.xxxxx.xx'
  })
</script>

module mode

1.安装

npm install performance-tracker --save

2.在文件中添加

import Performance from 'performance-tracker'

Performance.config({
    debug: 1, // 为1的话是在调试栏里输出，默认为0，直接发射
    name: 'example_site'
    url: 'https://xxx.xxxxx.xx'
})

接口

log 通用发送接口 【使用方法】某些情况下我想针对一些特定资源来统计，这样就可以使用这个参数

if (location.search.indexOf("hmsr") === -1) {
  window.Performance.log({
    name: 'NOHMSR',
    time:'没有hmsr参数'
  })
}

项目设计

• performance 作为一个收集类，和错误收集，埋点收集类似，这个的发送时间应该是在onload时间之后发送，如果客户端发起log事件就会单独发送，这里存在一种情况，就是onload完成之前用户已经跳转，这种发送应该有客户端储存的功能
• 增加一个reporter类，专门负责发送数据

API