监控有四个点:
- 网页崩溃(crashes)
- JavaScript 执行出错
- 网页卡顿
- 首屏渲染
网页崩溃的监控
使用 service worker 和 setInterval 来实现,参考:如何监控网页崩溃
JavaScript 执行出错
使用 sentry 来对上报错误即可
网页卡顿的监控
网页卡顿就是掉帧,fps 太低了,fps 的监控分为两部分
关键在于,线上用户监控时,如何上报 fps 数据,有两种方案:
- 开源的前端监控方案:sitespeed.io
- 自建数据上报,通过 navigator.sendBeacon 上传数据
首屏渲染
借助 window.performance API来实现首屏渲染的监控
打开网页的生命周期
网友评论