这是我参与「第五届青训营 」伴学笔记创作活动的第 10 天
课堂重点
后天就要讲前端监控 SDK，这是我之前没有接触到的部分，所以进行写课前预习
课前预习
1.了解前端监控是做什么，做前端监控有什么价值
首先我们要确定，异常是不可控的，并不能确定什么时候或者什么场景会发生异常，但它却会实实在在的影响用户体验。所以，我们非常有必要去做这样一件事情，去了解用户的行为，以用户数据为基础，来指导我们产品的优化方向。因此进行前端的监控，前端的监控主要可以分为三大类：数据监控、性能监控和异常监控。
价值：
2.了解 Navigation Timing 和 Navigation Timing 2 的相关字段
Navigation Timing概念和用法
你可以使用Navigation Timing API在客户端收集性能数据，并用XMLHttpRequest 或其它技术传送到服务端。同时，该API使你可以衡量之前难以获取的数据，如卸载前一个页面的时间，在域名解析上的时间，在执行load事件处理器上花费的总时间等。
为了帮助开发者更好地衡量和改进前端页面性能，W3C性能小组引入了 Navigation Timing API ，实现了自动、精准的页面性能打点；开发者可以通过 window.performance 属性获取。
performance.timing接口（定义了从navigationStart至loadEventEnd的 21 个只读属性）performance.navigation（定义了当前文档的导航信息，比如是重载还是向前向后等）
下图是W3C第一版的 Navigation Timing 的处理模型。从当前浏览器窗口卸载旧页面开始，到新页面加载完成，整个过程一共被切分为 9 个小块：提示卸载旧文档、重定向/卸载、应用缓存、DNS 解析、TCP 握手、HTTP 请求处理、HTTP 响应处理、DOM 处理、文档装载完成。每个小块的首尾、中间做事件分界，取 Unix 时间戳，两两事件之间计算时间差，从而获取中间过程的耗时（精确到毫秒级别）。
上图是 Level 1 的规范，2012 年底进入候选建议阶段，至今仍在日常使用中；但是在W3C的议程上，它已经功成身退，让位给了精度更高，功能更强大，层次更分明的 Level 2（处理模型如下图）。比如独立划分出来的 Resource Timing，使得我们可以获取具体资源的详细耗时信息。
3. Performance 与 Performance observer 对象
perfomance实际就是前端性能数据，即window.perfomance
perfomance observer,可以指定对perfomance的一些属性进行监听 blog.csdn.net/weixin_4396…
4.了解addEventListener与removeEventListener这两个函数
addEventListener（）方法用于向指定元素添加监听事件。且同一元素目标可重复添加，不会覆盖之前相同事件，配合removeEventListener（）方法来移除事件。
5.了解什么叫做hook
6.了解什么叫做链式调用
个人总结
原来浏览器这么强大，给了我们这么多功能使用
