web-performance-timing
v2.0.1
Published
web性能检测、错误捕获(Web performance detection, error capture)
Readme
页面性能检测,错误信息捕获
html 直接引入
<html>
<head>
<meta charset="UTF-8">
<title>webPerformance</title>
<script src="http://static.yxlblog.com/js/webPerformance.min.js"></script>
<script>
webPerformance({}, function (res) {
//coding 性能检测和错误上报
});
</script>
</head>npm 引入
import {
webPerformance
} from 'web-performance-timing'
//性能查看
webPerformance({}, (res) => {
console.log(res);
})
//vue 使用
Vue.config.errorHandler = function (err, vm, info) {
//其他的操作自己编辑
webPerformance.addError({
msg:err,
})
}
//react 使用
componentDidCatch(error, info) {
webPerformance.addError({
msg:error,
})
}
- url 上报页面地址
- preUrl 来访上一页面 URL
- performance 页面性能数据详情，字段含义详情请参考后面内容
- errorList 页面错误信息详情，包含 js,img,ajax,fetch 等所有错误信息，字段含义详情请参考后面内容
- resoruceList 页面性能数据详情，当前页面所有资源性能详情信息，字段含义详情请参考后面内容
- markUv 统计 uv 标识
- markUser 从用户进入网站开始标识，直到用户离开销毁，可以用来做用户漏斗分析
- time 当前上报时间
- screenwidth 屏幕宽度
- screenheight 屏幕高度
- isFristIn 是否是某次会话的第一次进入
- type 上报类型 1:页面级性能上报 2:页面 ajax 性能上报 3：页面内错误信息上报
| parameter name | describe | explain | | -------------- | ------------------------------ | ------------------------------- | | url | 上报页面地址 | | | isFristIn | 是否是每次会话的第一次渲染 | 可以用来做首屏渲染性能统计分类 | | screenwidth | 屏幕宽度 | | | screenheight | 屏幕高度 | | | preUrl | 上一页面 | | | | | | | errorList | 错误资源列表信息 | | | t | 资源时间 | | | n | 资源类型 | resource，js，ajax，fetch,other | | msg | 错误信息 | | | method | 资源请求方式 | GET，POST | | resourceUrl | 请求资源路径 | | | col | js 错误行 | | | line | js 错误列 | | | status | ajax 错误状态 | | | text | ajax 错误信息 | | | | | | | performance | 页面资源性能数据(单位均为毫秒) | | | dnst | DNS 解析时间 | | | tcpt | TCP 建立时间 | | | wit | 白屏时间 | | | domt | dom 渲染完成时间 | | | lodt | 页面 onload 时间 | | | radt | 页面准备时间 | | | rdit | 页面重定向时间 | | | uodt | unload 时间 | | | reqt | request 请求耗时 | | | andt | 页面解析 dom 耗时 | |