如何做好前端监控方案【热度: 672】

[yanlele]

关键词：前端监控

作者推荐可以直接参考下面这个文章就好了， 写的挺不错的。 https://juejin.cn/post/7285608128040206391

作者在这里， 对上面的文章进行一下简单的总结

全文总结： Web 前端监控的方案，包括前端监控的意义、内容、形式、总体方案设计、监控指标、前端埋点方案、上报逻辑、监控数据存储、管理平台展示、报警通知、优化整改等方面。

重要：

• 前端监控的意义：如同城市探头，实时监测保证系统稳定高效，为业务赋能获取更多用户。能够快速解决用户线上问题、用户性能问题；给予产品决策提供数据支撑。
• 2-5-8 原则：阐述不同响应时间用户的感受和可能的行为。
• 监控的内容：包括用户行为程序异常、运行性能。
• 监控的形式：分为主动和被动监控。
• 总体方案设计：涵盖页面埋点、数据上报、后台存储、汇总统计、报警展示、优化整改等环节。
• 监控指标：性能指标如 FP、FCP、FMP 等以及 Google Web Vitals 中的 LCP、FID、CLS 等，还有用户指标如 UV、PV 等。
• 前端埋点方案：介绍了写死在业务代码、全量埋点、动态埋点三种方式，推荐动态埋点。
• 上报逻辑：ajax、fetch 上报、image 上报、jsonp 上报、sendBeacon 上报，推荐 sendBeacon 上报。
• 监控数据的存储：可存于 Hadoop 大数据平台、MySQL 关系数据库、NoSQL 存储。
• 管理平台展示：包括注册和管理业务项目、查看监控数据、配置监控规则和阈值。
• 报警通知：通过定时任务读取配置表，根据规则查询数据，有多种通知形式。
• 优化整改：针对性能不达标和用户留存低提出多种措施。