阿里UC百亿PV的前端监控平台:（5）数据可视化

时间 2019-11-05

标签阿里百亿前端监控平台数据可视化栏目阿里巴巴繁體版

原文原文链接

本文首发于知乎《阿里UC百亿级PV的前端监控平台实践》，搬运转载请注明出处，不然追究版权责任。javascript

阿里UC百亿PV的岳鹰全景监控平台实践系列文章：html

前言

Web承载的业务愈来愈复杂，用户对于Web的体验要求也愈来愈高，Web性能的优劣对业务收益也有着很是直接的影响。前端

本文主要介绍阿里UC百亿级PV前端监控平台，岳鹰全景监控平台的实践历程 - 数据可视化，阅读时长 5 分钟。java

通过数据清洗存储、统计分析这2个步骤以后，经过数据来定位解决问题的方法思路已经妥妥的存储在后端服务器；接下来要作的就是把数据可视化的呈现给开发者，让数据会说话。git

经过数据的实时展示，能够第一时间发现异常指标，而且对这一时刻的指标进行分析，例如截图中的「资源加载异常」。github

图1：实时大盘

图2：定位到这一分钟的资源加载异常

对于页面性能这种周期指标，能够更长时间周期的观察。另外，页面性能的均值做为用户体验的衡量，还须要考虑长尾用户的体验，所以咱们也提供了页面性能区间分布的统计，能够直接定位到页面访问缓慢的日志。web

图1：页面性能趋势

图2：页面性能样本分布

经过对数据统计聚类，发生异常的状况进行统计，从时间、地域、网络等不一样维度加以统计，找出规律，找到问题影响范围进一步分析。对于JS异常，还能够经过 source map 映射源码，快速定位到报错的具体代码。小程序

图1：维度统计分析

图2：source map

阿里UC出品的岳鹰全景监控平台，支持移动H五、PC站点、微信小程序以及支付宝小程序等各家小程序，PV、JS异常、页面性能等监控指标完整，已经对外开放，欢迎免费体验试用。后端

技术交流、第一时间掌握产品动态，欢迎联系微信小助手～微信小程序