跳转到主要内容

概述

Flashduty RUM 分析看板提供了开箱即用的可视化仪表板,自动采集并分析用户会话、性能、资源、错误等多维度数据,助力您全面洞察应用真实运行状况,快速定位性能瓶颈与异常问题,持续优化用户体验。 分析看板主要包含以下四个分析维度:

概览

关键指标一目了然

性能分析

全面掌控应用体验

异常分析

快速定位与诊断错误

资源分析

精细化资源优化

概览

RUM 分析看板概览

RUM 分析看板 - 概览

概览模块聚焦于应用多维度的核心指标:
指标类型说明
流量指标监控 PV(页面浏览量)、UV(独立访客数)、会话数,把握整体访问趋势
用户分布结合地理位置、设备类型等信息,洞察用户来源与活跃区域
健康与性能指标显示核心 Web 指标:LCP(最大内容绘制)、FID(首次输入延迟)、CLS(累积布局偏移)
异常与错误统计各类型错误率,快速发现潜在风险点

性能分析

RUM 性能分析

RUM 分析看板 - 性能分析

性能分析模块专注于应用加载与交互体验的全链路监控:
  • 页面性能:监控 FCP、LCP、CLS 等页面加载核心指标的趋势与样本分布
  • 长任务长动画帧渲染更新延迟超过 50 毫秒的情况
  • XHR 和 Fetch 请求:分析接口的加载性能,定位慢接口
  • 静态资源:分析静态资源的加载耗时,定位应用加载时的性能瓶颈
有关显示数据的更多信息,请参阅 数据收集

异常分析

RUM 异常分析

RUM 分析看板 - 异常分析

异常分析模块提供全方位的错误监控与诊断能力:
  • 页面错误率:发生错误最多的页面,帮助您定位优先需要关注的页面
  • 热门 Issue:影响用户最多的 Issue 排行,详见 异常聚合
  • 代码错误:分类展示错误类型,详见 异常追踪
  • 接口和资源错误:监控哪些接口和静态资源产生的错误最多

资源分析

RUM 资源分析

RUM 分析看板 - 资源分析

资源分析模块帮助您识别对应用影响最大的资源:
  • 资源排行:监控加载最多与最重的资源,识别优化重点
  • 资源加载时序:监控资源耗时趋势(DNS 解析、TCP 连接、加载耗时等)
  • XHR 和 Fetch 请求:区分不同请求类型、方法和错误状态码的分布趋势
  • 第三方资源:资源地址(host)与当前页面地址(host)不匹配的资源被识别为第三方资源

常见问题

可能有以下原因:
  1. 连接复用 (Keep-Alive):当资源请求采用 keep-alive 方式保持连接时,DNS 查询和 TCP 连接过程只会在首次请求时发生,后续请求复用同一连接
  2. 跨域加载资源:如果资源以跨域方式加载且未配置相关头部信息,浏览器无法采集完整的性能数据(主要原因)
  3. 浏览器兼容性:极少数情况下,某些浏览器可能不支持 Performance API
  1. 跨域加载资源:如果资源以跨域方式加载且未设置跨域访问权限,浏览器将无法获取资源状态信息
  2. 浏览器兼容性:某些浏览器可能不支持 Performance API(极少见)
1. 采集跨域资源的时序数据在跨域资源的 HTTP 响应头中添加:
Timing-Allow-Origin: *
详见 MDN 文档 Resource Timing API2. 采集跨域资源的状态码在跨域资源的 HTTP 响应头中添加:
Access-Control-Allow-Origin: *
在引用资源的 HTML 标签中添加 crossorigin="anonymous"
<img src="https://static.example.com/logo.png" crossorigin="anonymous" />
详见 MDN 文档 Access-Control-Allow-Origincrossorigin 属性
登录态用户识别对于需要用户登录的应用(如 SaaS 产品、会员系统、电商平台等),参考 用户会话设备指纹识别对于无登录态的应用(如企业官网、营销页面等),推荐基于浏览器特征、设备信息等多维数据生成稳定的指纹并上报用户标识。