平台通过灵活上报不同类型的错误、性能、操作、自定义数据,结合多维分析和日志链路,帮助开发者对于Web端真实数据进行报警归因、聚类分析、细节定位,解决用户白屏、性能瓶颈、慢查询等关键问题。
https://www.volcengine.com/docs/6431/102455
白屏往往是因为代码执行错误或者资源加载失败,导致页面渲染失败。一旦发生了白屏,页面就处于不可交互的状态,阻碍了用户使用,导致了用户流失。业界现有的检测办法是单纯基于dom的检测,方法单一、通用性较差,缺乏业界认可的检测算法,并且无法针对白屏进行归因,无法为白屏提供有效的修复引导。
对此,火山引擎应用性能监控全链路版Web Pro监控采用不断完善的打分策略、回测任务、即时截图保证了白屏检测的高准确性,使用户能够及时发现页面的白屏状态,并提供可归因分析的相关数据,有效帮助业务定位问题。
首先,使用白屏列表查看趋势以及条目,如下图所示:
SDK侧,Web Pro监控采集了非常全面的性能指标,包含了fp、fcp、fmp、tti、navigation timing等常规性能指标,也有lcp、fid、mpfid、cls等最能代表用户体验的指标,此外,页面发生的longtask也会进行上报。
更多详细说明可以查看该文档链接以及同级链接https://www.volcengine.com/docs/6431/107441
平台侧,Web Pro监控提供了页面性能总览和页面维度的性能指标,配合参考线,能够直观地展示所有性能指标在该时间段内的达标程度,然后针对于异常指标,进入数据探索页面进一步分析。
具体步骤如下:
进入「项目设置」页面根据业务场景对于性能指标参考线进行设置。
性能参考线默认值参考了web.dev
https://web.dev/user-centric-performance-metrics/
例如LCP的参考值为2000ms以内优秀,4000ms以上为较差,使用者可以在设置里根据实际需求调整参考值,比如下图把3500ms以上定义为较差。
进入数据探索页后,自动筛选出了当前LCP > 3500ms的日志,可以查看优化建议文档https://zjsms.com/FRDMgec/ ,结合指定日志的瀑布图进行针对性优化,具体可以参考下文数据探索中对于页面加载的分析。
目前大部分的监控工具,都提供了类似 Feed 流布局的日志细查能力。但这类工具存在以下缺陷:
状态难以保持;
数据来源太过分散,归因能力差,定位速度慢;
仅展示原始上报,无法进一步展现更多信息。
为了解决这些问题,火山引擎Web Pro监控推出了强大的数据探索能力,该页面能够同时满足日志细查、多维分析、用户行为重建等功能,通过它来承载从宏观视角到微观视角的转换。例如,白屏监控、JS错误监控、请求监控等页面展示的聚合数据,都能带上当前的上下文信息跳转到数据探索页面,下钻到详细日志。定位到某一条日志后,可以通过如下方式进行探索分析:
在数据探索的Session事件中,将用户的一次站点访问中的所有事件聚合按时序展示;
通过关键字或事件类型进行过滤,可以快速找到用户关心的事件;
点击列表中具体事件,可以直接查看该事件的详情页面。
View标签页里的每一条日志,将发生在该次页面访问下的静态资源,请求,longtask等信息聚合成时序瀑布,结合RUM、navigation指标线,协助用户进一步判断影响当前指标的因素。
同时,针对时序中表现异常的事件,点击具体事件名进入其详情,具体观测其timing、请求等相关信息。
SDK内部的所有监控能力完全是一个个插件,支持可拔插、按需打包,且支持自定义插件。更多关于自定义插件的说明请参考文档:
https://www.volcengine.com/docs/6431/108981
采样规则重构,支持所有上报字段的采样、各种操作符的过滤以及采样条件的与和或。
提供release概念,打通研发流程,为平台提供版本间优劣化数据比较,错误自动分配处理人等提供基础纬度。
提供env以配置不同环境,平台支持不同环境数据隔离消费,避免线下 / 测试数据影响线上稳定性监控。
提供viewid等标识,更好描述和串联一次页面生命周期的各类上报数据,为性能优化等排查提供依据。
面向Web监控的全新解决方案带来了更加优雅、轻便、高性能的SDK,更加贴近用户需求的消费平台,同时未来还会增加更多实用的新特性,比如白屏自动归因、React错误消费、action的上报及相关链路消费等等,欢迎体验并持续关注我们的更新。
💡预告:「前端性能监控训练营」将于6月开放报名,敬请期待
目前,我们特别推出「APMPlus企业助力行动」,为中小企业提供应用性能监控免费资源包。现在申请,有机会获得60天免费性能监控服务,最高可享6000万条事件量。
点击阅读原文,即可申请⬇️