深入了解前端监控原理

（给前端大全加星标，提升前端技能）转自：掘金 - 谭光志前端监控分为性能监控和错误监控。其中监控又分为两个环节：数据采集和数据上报。本文主要讲的就是如何进行数据采集和数据上报。数据采集性能数据采集性能数据采集需要使用 window.performance  API https://developer.mozilla.org/zh-CN/docs/Web/API/Performance  Performance 接口可以获取到当前页面中与性能相关的信息，它是 High Resolution Time API 的一部分，同时也融合了 Performance Timeline API、Navigation Timing API、 User Timing API 和 Resource Timing API。从 MDN 的文档可以看出，window.performance.timing 包含了页面加载各个阶段的起始及结束时间。这些属性需要结合下图一起看，更好理解：在这里插入图片描述为了方便大家理解 timing 各个属性 ………………………………