稳定性是指从用户的角度出发，对整个系统的业务流程的稳定性保证，对应到业务上的崩溃、卡顿、响应慢、业务bug等这些都是会影响整个系统稳定性。、
稳定性建设主要分布以下八个方面： 浏览器兼容、监控和告警、代码质量、网络请求、第三方服务资源、业务需求迭代、技术迭代更新
一、监控体系
监控体系可以分为四块：监控、告警、日志、定位追踪
1.1 监控
监控对象分类,可以分为四类：保证用户体验的数据需要监控性能数据、保证项目稳定性的需要监控错误数据、勾勒用户行为的需要监控用户行为数据、监控业务相关的转化率、跳出率、退出率的就需要就监控业务数据
(1) 稳定性监控 - 错误数据（4种错误类型）
稳定性监控指标
- 静态资源加载错误（JS/CSS/CDN）
- JS代码错误
- 接口错误
- 页面白屏
数据收集方式
总共通过window.addEventListener两种事件监听方式：
- error事件 - 【静态资源 + js代码执行】
- unhandleRejection事件 - 【promise错误】
数据上报方式
三种方式：img、ajax、senBecon
(2) 性能监控 - 性能数据
性能监控指标
首屏时间、白屏时间、首次可交互时间、交互延迟时间
(3) 用户行为监控 - 用户行为数据
(4) 业务指标监控 - 业务数据
业务监控指标：
登录成功率
跳出率
退出率
转化率
1.2 告警
告警阶段主要需要做的流程：配置告警规则、触发实时通知负责人 告警规则的配置 告警体系建设存在的共性问题
1.2.1 告警指标
1.设置哪些告警指标
| 稳定性告警指标 | 说明 |
|---|---|
| 1. 资源错误率 | （单位时间内）资源加载错误的次数 / 总资源请求次数 |
| 2. JS错误率 | （单位时间内）js错误总数 / 访问的pv总数 |
| 3. JS错误影响率 | （单位时间内）发生js错误用户数量 / 这段时间内访问的用户总数 |
| 4. 接口错误率 | （单位时间内）报错的请求次数 / 所有请求次数 |
| 5. 白屏率 | （单位时间内）出现页面白屏的用户数量uv / 这段时间内所有用户uv数量 |
比如我有一个场景，有js错误率，js错误影响率，白屏率，接口率、cpu使用率，那么多系统指标，甚至后续会加上业务指标，那么我们难道对所有的指标都需要设置告警吗？还是对一些重要适合的指标设置即可。
2.设置什么告警阈值
场景：如果我已经确定好了告警指标，例如js错误率，那么难道有一个我就要立即通知维护者吗，那么是不是每天收到好多告警呢？但是如果阈值设置太高，那么就会漏掉或者不能及时响应重要问题。因此，我们需要每个指标设置合适的阈值。
js错误率
js错误影响率
1.2.2 告警规则
根据系统架构和业务特点，设置合理的告警规则和阈值。
1.2.3 告警通知
告警通知策略：按照不同的告警级别，以邮件、短信、电话等不同方式通知到对应负责人
1.2.4 告警闭环跟踪
告警通知到对应的负责人之后，负责人处理完告警，需要将流程运转结束，完成告警流程。
1.2.5 其他问题
问题1. 告警频繁问题
问题背景 - 由于前端技术的特点，js相对容易出现那执行错误，但是这些执行错误并不一定会导致页面出现问题，或者对用户造成感知。但是依然会被捕获并上报到，这就导致了告警数量增加，让真正影响用户体验的JS错误告警被海量告警淹没。
问题：如何合理配置告警规则
问题表现 - 如果统一去看告警，那么就会花时间去看那些不影响用户的js错误。而如果统一不去管，那么就会导致用户相关的错误也不管了。而如果每次都去筛选的话，那么就会浪费时间去筛选。
理想情况是：如果可以规则配置过滤掉那些影响用户的js错误，只针对真正有影响的js错误才触发告警才是最好的。
解决方案-告警治理：
（1）告警清洗：异常清洗去除不必要告警噪声
（2）告警去重：对于一段时间内重复发生的告警，可以只上报一次
（3）阈值调整：重新更改告警规则中的阈值
（4）优先级降低：降低优先级，进而不发送告警
（5）时间窗口设置：在指定时间内发生的错误才告警，否则不告警
问题2. 灰度小流量故障监控
问题3. 提升告警覆盖率
1.3 日志
step-1 识别错误类型
前端错误类型可以分为三类：
1.静态资源加载错误
2.JS错误
1.语法错误 - EyntaxError ：例如定义一个函数缺少函数名
2.类型错误 - TypeError ：例如：使用fn.a()，但是定义时候fn.a赋值为一个对象，这里却当做方法函数使用，这个时候就会报类型错误。或者obj = {}， 然后后面使用obj.a.b，就会报类型错误。
3.引用错误 - refenenceError ：比如引用一个不存在的变量（前面没有定义这个变量）
4.范围错误 - RangeError：一般在数组长度length赋值为负数。number对象范围超出了
3.接口请求错误
promise错误，当我们使用promise发出请求时，但是没有写try-catch，或者使用reject来捕获的话，那么系统会自动爆出一个unhandled promise rejection的错误，这个错误类型只有监听“unhandledrejection事件”才能捕获到 - 这是唯一一个特殊的点。
4.框架错误
Vue.config.errorHandler
1.4 定位
错误发生在哪个页面，然后通过错误堆栈 二、
