Elastic RUM

Elastic 可观测性套件中的真实用户监控 Agent，将浏览器性能、错误与用户体验数据写入 Elasticsearch，在 Kibana 统一分析。

错误监控RUMElastic性能监控

Elastic RUM 是 Elastic Stack 浏览器端监控组件，采集页面加载、路由变化、HTTP 请求、JavaScript 错误与 Core Web Vitals，写入 Elasticsearch 在 Kibana APM 可视化，与后端 trace 端到端关联。

访问官网

Elastic RUM

Elastic 可观测性套件中的真实用户监控 Agent，将浏览器性能、错误与用户体验数据写入 Elasticsearch，在 Kibana 统一分析。

技术简介说明

Elastic RUM（Real User Monitoring）是 Elastic Stack（Elasticsearch + Kibana + Elastic Agent）中的浏览器端监控组件。通过在页面注入 Elastic APM RUM JavaScript agent，采集页面加载、路由变化、HTTP 请求、JavaScript 错误与 Core Web Vitals，并将数据写入 Elasticsearch，在 Kibana APM 或 Observability 应用中可视化。

对已部署 Elastic 用于日志（ELK/EFK）、APM 或安全分析的企业，Elastic RUM 提供同一数据平面上的前端信号，可与后端 APM trace 关联，实现从用户点击到微服务调用的端到端追踪，而无需引入 Datadog/New Relic 等额外供应商。

基本信息

官网：https://www.elastic.co/observability/real-user-monitoring
文档：https://www.elastic.co/guide/en/observability/current/rum.html
License：Elastic License 2.0（Stack）；RUM agent MIT
Agent 包：@elastic/apm-rum、@elastic/apm-rum-react
主要维护者/公司：Elastic N.V.
运行环境：浏览器；需 Elastic APM Server / Elastic Cloud

快速上手

安装

npm install @elastic/apm-rum

React：

npm install @elastic/apm-rum-react

最小示例

import { init as initApm } from '@elastic/apm-rum'
 
const apm = initApm({
  serviceName: 'my-frontend',
  serverUrl: 'https://apm-server.example.com',
  serviceVersion: '1.0.0',
  environment: 'production',
  distributedTracingOrigins: ['https://api.example.com'],
})

React 路由集成

import { ApmRoutes } from '@elastic/apm-rum-react'
import { Route } from 'react-router-dom'
 
<ApmRoutes>
  <Route path="/" element={<Home />} />
  <Route path="/about" element={<About />} />
</ApmRoutes>

自定义事务与错误

const transaction = apm.startTransaction('checkout', 'custom')
const span = transaction?.startSpan('validate-cart', 'app')
try {
  await validateCart()
} catch (err) {
  apm.captureError(err)
} finally {
  span?.end()
  transaction?.end()
}

核心特性

页面与 SPA 事务：自动或手动创建 transaction/span 模型。
分布式追踪：distributedTracingOrigins 与后端 Elastic APM agent 关联。
JavaScript 错误：自动 captureError。
HTTP 请求监控：fetch/XHR 自动 instrumentation。
Core Web Vitals：LCP、FID/INP、CLS 等指标（视 agent 版本）。
Kibana 可视化：User Experience 应用、APM 瀑布图。
Elastic Cloud 一键：托管 APM Server 与 Elasticsearch。

适用场景

企业已标准化 Elastic Stack 做日志与 APM。
需要前后端 trace 在同一 Kibana 界面串联。
自建/on-prem 部署，数据不能上第三方 SaaS RUM。
安全与运维团队已熟悉 Elasticsearch 查询与索引生命周期管理。
与 Elastic SIEM/Security 同一平台整合运营遥测（大型企业）。

技术亮点

统一 Elastic 生态：日志、指标、APM、RUM 同一供应商与 UI。
分布式追踪成熟：Browser transaction → backend span 关联配置文档完善。
可自托管：完全 on-prem 满足数据主权。
React 官方绑定：ApmRoutes 简化 SPA 路由事务。
索引生命周期：ILM 管理 RUM 数据保留与成本。

核心概念与架构

@elastic/apm-rum（浏览器 Agent）
      ↓
 APM Server / Fleet（接收 intake）
      ↓
 Elasticsearch（rum-* 等数据流）
      ↓
 Kibana Observability / APM UI
      ↕
 Backend APM traces（同一 trace.id）

核心概念

serviceName：RUM 服务名，与后端 APM 服务可区分。
serverUrl：APM Server 接收端点。
Transaction / Span：与后端 APM 一致的数据模型。
distributedTracingOrigins：允许注入 trace header 的 API 源。

技术局限与边界

无 Session Replay：不提供 DOM 回放（需另配 OpenReplay 等）。
Elastic License 变更：Stack 许可策略近年调整，需法务确认（ELv2/SSPL 历史争议）。
配置门槛：需正确部署 APM Server、CORS、TLS，比 SaaS RUM 繁琐。
前端 DX：不如 Sentry 现代 SDK 与 Issue 工作流细腻。
资源消耗：Elasticsearch 存储 RUM 事件，高流量需容量规划。

生态地图

RUM Agent：@elastic/apm-rum
React：@elastic/apm-rum-react
Server：Elastic APM Server、Elastic Agent、Fleet
UI：Kibana Observability、User Experience
对比：Datadog RUM、Grafana Faro、New Relic Browser

生态集成

React / Vue / Angular：官方或社区集成指南。
后端 Java/Node/Go：Elastic APM agent 开启 RUM 关联。
CORS：API 需允许 traceparent 等 header。
Kibana Alerting：对 CWV 或错误率创建规则。
ILM：hot-warm-cold 策略控制 RUM 索引成本。

开发与工程化

serverUrl 环境分离：staging/production 不同 APM Server。
serviceVersion 对齐发布：便于 Kibana 按版本过滤回归。
distributedTracingOrigins 最小化：仅列可信 API 域，避免 header 泄露风险。
采样配置：APM Server 端设置 transaction_sample_rate 控费。
避免双重 agent：勿与 New Relic/Datadog JS agent 全量同页加载。

性能与安全

性能：异步批量 intake；注意 agent 版本 bug 导致的内存泄漏，保持更新。
安全：serverUrl 暴露合理；APM Server 需认证与 TLS。
Trace header：仅对信任源开启分布式追踪，防止跨域信息泄漏。
PII：captureError 可能含用户输入，配置 filter 或 sanitize。

技术对比

维度	Elastic RUM	Grafana Faro	Datadog RUM
存储	Elasticsearch	Loki/Tempo/Mimir	Datadog 后端
自建	强	强	弱
Replay	无	无	有
Trace 关联	强	强（Tempo）	强
许可	ELv2	Apache-2.0	SaaS
适合	ELK 存量	Grafana 存量	全栈 SaaS

最佳实践

与后端 APM 同 trace 配置，发挥 Elastic 端到端优势。
Kibana User Experience 仪表板监控 CWV 分位数。
ILM 策略必配，RUM 数据量增长快。
React 用 ApmRoutes，避免 SPA 路由事务缺失。
评估 License，确保符合公司开源/商业政策。
需要 Replay 时外接 OpenReplay，Elastic 不覆盖此能力。

学习与社区资源

RUM 文档：https://www.elastic.co/guide/en/observability/current/rum.html
APM RUM Agent 参考：https://www.elastic.co/guide/en/observability/current/rum-js-agent.html
GitHub：https://github.com/elastic/apm-agent-rum-js
Distributed tracing：https://www.elastic.co/guide/en/observability/current/distributed-tracing.html
Elastic Discuss 论坛：RUM 专题