[!info] related notes

• 所属 MOC: 前端工程化 MOC
• 相关概念: ai-product-frontend-reliability, ai-chat-performance-optimization, frontend-engineering-performance-optimization, first-paint-vs-time-to-interactive
• 测量边界: 首字延迟排查, AI 服务可观测性
• 面试问法: AI 对话产品前端性能怎么优化, [private note]

AI 前端监控指标

AI 业务前端不能只看传统页面性能指标，还要把流式输出和业务效果纳入监控。

一句话定义

AI 前端监控指标，应该同时覆盖错误监控、性能监控、行为埋点和 AI 业务特有指标，才能真正定位体验问题。

四类常见指标

错误监控

• JS 运行时错误
• Promise 未捕获错误
• 资源加载错误
• 接口异常

性能监控

• FCP
• LCP
• INP
• 首次可见时间
• 自定义可交互时间（明确触发条件，不与 INP 混用）
• P50 / P90 / P95 分位数

行为埋点

• 进入率
• 点击率
• 转化率
• 中止率

AI 业务指标

• 用户提交到首个回答文本可见的时间（与后端模型 TTFT 分开）
• 用户提交到回答完成并呈现的时长
• 流中断率
• 重试率
• 用户中止率
• 反馈好评率/差评率

为什么 AI 前端特别要看分位数

AI 产品很容易出现长尾体验：

• 弱网环境首 token 很慢
• 长回答流式过程中断
• 低端设备渲染 Markdown / code block 更卡

所以只看平均值往往不够，至少要看：

• P50：观测样本的中位数，约一半样本不超过该值
• P90 / P95：观测样本的高分位延迟，用于看长尾

P50 较低而 P95 较高说明存在慢样本，不能直接归因弱网或低端设备；还需按设备、网络、输入长度、模型和是否检索分组排查。

一组更实用的采集思路

页面性能层

• FCP / LCP / INP
• 页面进入到首屏可见时间
• 首次交互响应时间

流式体验层

• 用户提交到首个回答文本可见的时间（与后端模型 TTFT 分开）
• 完整回答耗时
• 中途断流率
• 用户主动停止比例

可靠性层

• 请求错误率
• 重试成功率
• Markdown/code block 渲染异常率

业务效果层

• 发送率
• 追问率
• 重新生成率
• 点赞 / 点踩率

固定统计口径

• 延迟按同一开始 / 结束边界统计；失败和中止请求单列，避免只看成功样本掩盖问题。
• 中断率区分用户主动停止、页面离开、网络断开和服务端失败；断流不等于 run 失败。
• 重试成功率明确分母是重试尝试还是发生过重试的任务；首次尝试成功率另报。
• 反馈比例按实际反馈数计算，并报告反馈覆盖率；点赞、追问或重新生成本身不能证明答案正确。
• request / run / message ID 用于事件关联，避免日志中默认采集完整提问、健康资料或凭据。

面试里一句话怎么答

AI 前端监控我会分页面性能、流式体验、可靠性和业务效果四层来采。除了 FCP、LCP、INP 这类传统指标，还会看首 token 时间、完整回答时长、流中断率和用户中止率；统计口径上不会只看平均值，而会重点看 P90、P95 观察长尾体验。

最短记忆方式

AI 前端监控要同时看页面快不快、流稳不稳、用户用得顺不顺。

Related notes

• AI MOC