前端监控

自托管 · 数据完全私有 · ClickHouse 驱动

错误、性能、行为
一站式前端可观测性

错误追踪、性能指标、行为轨迹——看清你的产品在用户端真实的样子。Web 与微信小程序原生支持。

控制台 · 示例商城

Issues

128

↑ 12 新增(今日)

LCP P75

1.9s

良好 · 近 24h

今日 PV / UV

12,408

UV 3,921 · Session 5,204

告警 · 错误突增

错误趋势 · 近 24 小时

TypeError: Cannot read properties of undefined… order/detail · 2,341 次
接口 /api/pay 超时率 8.2% checkout · P95 4.1s

10min

从安装 SDK 到看到第一张报表

3合1

一个 SDK 覆盖错误、性能、行为

100%

数据私有,不出你的机房

1条

docker compose 命令起全栈

三大核心能力

采集一次,三处受益——同一个 SDK 驱动错误、性能与行为

错误追踪

JS / 接口 / 白屏全覆盖,SourceMap 还原堆栈,面包屑重现事故现场。

92 / 100

性能评分 · 良好

性能指标

Web Vitals 分位数趋势,慢接口与长任务一目了然。

行为分析

PV/UV 与受众画像,错误发生前的完整操作轨迹。

访问首页 12,408
进入详情 7,693
完成支付 3,846

告警引擎

规则可视化配置,钉钉 / webhook 秒级触达,冷却防抖不轰炸。

🔴 【前端监控】错误突增告警

order/detail · TypeError · 5 分钟内 320 次(阈值 100)

隐私内建

手机号 / 卡号自动脱敏,接口地址去 query,TTL 可配。

phone: 13812345678

phone: 138****5678

平台能力

你需要的不是一堆工具,而是一个开箱即用的完整平台

✓

告警规则引擎

规则可视化配置,钉钉 / webhook 推送,冷却防抖。

✓

报表中心

日/周/月报导出 CSV,每日摘要定时推送到群。

✓

多应用工作区

以应用为中心的 workspace 隔离,按应用授权管理。

✓

微信小程序原生支持

原生 / Taro / uni-app 通吃,加载耗时与 setData 体积分析。

✓

隐私内建

手机号 / 卡号自动脱敏,接口地址去 query,TTL 可配。

✓

自托管 · 数据私有

一条 docker compose 起全栈,数据不出机房。

别只听我的一面之词…

看看大家怎么说

“上线第一周就帮我们抓到一个只在安卓 WebView 复现的白屏,面包屑直接把用户的操作路径还原了出来。”
林

林一舟

电商平台 · 前端负责人

“数据放在自己机房,合规评审一次通过。一条 compose 命令起全栈,运维成本几乎为零。”
苏

苏晚

SaaS 创业公司 · CTO

“原生和 Taro 都接得上,setData 体积分析帮我们砍掉了 40% 的渲染耗时,小程序首屏快了近一倍。”
陈

陈默

小程序团队 · Tech Lead

“SourceMap 还原得很准,告警直接推到钉钉。值班同学再也不用整晚盯着大盘了。”
赵

赵启铭

金融团队 · 前端架构师

“从接入到看到第一张报表不到十分钟。错误、性能、行为一个 SDK 全搞定,之前要三个系统来回切。”
何

何雨桐

内容社区 · 前端工程师

“周报自动推到群里,稳定性第一次成了『看得见』的东西。老板现在每周主动问数据。”
周

周野

工具类产品 · 负责人

架构一览

采集 → 落库 → 展示与告警,一条链路看清

系统整体架构图:客户端 SDK 经 nginx 上报到 Fastify 服务端,写入 ClickHouse 与 SQLite;管理后台查询展示,告警与报表推送钉钉、邮件

可拖拽平移、滚轮缩放查看细节

构建于成熟稳定的技术栈

常见问题

接入前你可能想知道的

数据存在哪里?会不会上传到第三方? ▾

所有数据都落在你自己部署的 ClickHouse 中,不经过任何第三方服务。平台完全自托管,数据不出机房,TTL 可按需配置。

支持哪些端和框架? ▾

Web 端与框架无关(React / Vue / 原生均可);微信小程序提供原生 SDK,同时兼容 Taro 与 uni-app,含加载耗时与 setData 体积分析。

接入需要多久? ▾

安装 SDK 后两行代码完成初始化(appId + dsn + token),通常 10 分钟内即可在控制台看到第一张报表。

SDK 会影响业务性能吗? ▾

SDK 采用批量上报与空闲调度,主线程占用极低;支持采样率配置,可按流量灵活控制上报量。

告警有哪些触达方式? ▾

内置钉钉机器人与通用 webhook,规则可视化配置,支持冷却时间与防抖,避免告警轰炸。

和 Sentry 这类方案有什么区别? ▾

除了错误追踪,还内建了 Web Vitals 性能指标与 PV/UV 行为分析,一个平台覆盖可观测性三板斧;同时原生支持微信小程序,且数据完全私有。

一分钟接入

你的竞品已经开始用数据驱动修复问题了,你还在靠用户反馈发现 bug 吗?

main.ts

import { init } from '@monitor/web';

 

init({

appId: 'my-app',

dsn: 'https://…/api/v1/collect',

token: '…',// 创建应用时下发

});