前端工程化——监控

监控有四个点

  1. 网页崩溃(crashes)
  2. JavaScript 执行出错
  3. 网页卡顿
  4. 首屏渲染

网页崩溃的监控

使用 service workersetInterval 来实现,参考:如何监控网页崩溃

JavaScript 执行出错

使用 sentry 来对上报错误即可

网页卡顿的监控

网页卡顿就是掉帧,fps 太低了,fps 的监控分为两部分

  1. 开发时监控,可借助工具:lag-radar
  2. 线上用户监控,可参考:FPS 测试

关键在于,线上用户监控时,如何上报 fps 数据,有两种方案:

  1. 开源的前端监控方案:sitespeed.io
  2. 自建数据上报,通过 navigator.sendBeacon 上传数据

首屏渲染

借助 window.performance API来实现首屏渲染的监控

参考:初探 performance

打开网页的生命周期
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明AI阅读 16,038评论 3 119
  • 一直觉得生孩子是一件很伟大的事情,但从来不知道如此伟大。 我的妈妈怀孕了。快长大的我想着这样就可以知道女人生孩子是...
    谭银河阅读 3,599评论 0 1
  • Key-Value Observing 键值对观察者模式 基于OC强大的Runtime机制和isa-swizzle...
    define南拳阅读 1,235评论 0 1
  • 静静的夜,悄悄的雨 滴滴哒哒轻敲打你的门窗 你是否像我一样,呆呆的冥想 想着那美好的凝望 黑黑的夜,多情的雨 淅淅...
    雨沐先生阅读 2,515评论 0 0
  • 命名 在命名python类的时候还是使用class关键字来命名。 python类分为两种:经典类(旧类),新式类 ...
    dangeroussnack阅读 3,280评论 0 2