这是我参与「第五届青训营 」伴学笔记创作活动的第16天
前端监控是什么
前端监控是指通过收集和分析前端应用程序的运行数据，来了解用户体验、应用性能和稳定性等方面的情况。前端监控可以帮助开发人员快速发现和解决应用程序中的问题，提升用户体验和应用程序质量，同时还能为业务提供数据支持和决策参考。具体价值包括但不限于：提升应用程序性能和稳定性、改善用户体验、提高用户留存率和转化率、优化应用程序功能和设计等。
Navigation Timing
Navigation Timing 和 Navigation Timing 2 是浏览器提供的用于衡量页面加载性能的 API，它们提供了许多有用的指标，下面是它们的相关字段：
Navigation Timing：
- navigationStart：浏览器开始导航的时间
- fetchStart：浏览器准备请求页面的时间
- domainLookupStart：域名查询开始的时间
- domainLookupEnd：域名查询结束的时间
- connectStart：连接服务器开始的时间
- connectEnd：连接服务器结束的时间
- requestStart：浏览器开始请求页面的时间
- responseStart：浏览器开始接收页面的时间
- responseEnd：浏览器接收页面完成的时间
- loadEventStart：页面加载事件开始的时间
- loadEventEnd：页面加载事件结束的时间
Performance 与 Performance observer 对象
Performance 对象是浏览器提供的 API，用于提供关于页面性能的数据，包括页面加载时间、资源加载时间、JavaScript 执行时间等等。通过 Performance 对象，我们可以访问许多与页面性能相关的信息和指标。
Performance Observer 是另一个浏览器提供的 API，它可以观察 Performance 对象中的一些数据，比如长任务、资源加载、导航等，并且可以异步地收集这些数据。通过 Performance Observer，我们可以监控页面中的性能指标，并在指标满足特定条件时触发自定义逻辑。
Performance 对象提供了许多基于时间的方法和属性，可以帮助我们分析页面性能，如 performance.timing、performance.now()、performance.mark() 等等。而 Performance Observer 则提供了 observe() 方法用于观察指定的性能指标，可以通过回调函数收集和处理这些数据，以实现更精细的性能监控和优化。
什么叫做 hook
在计算机编程中，"hook"（钩子）是一种技术，它允许开发人员在应用程序执行的某些特定事件发生时注入自定义代码。通常，hook 能够拦截并修改应用程序的行为，从而允许开发人员自定义和扩展应用程序的功能。
在具体的编程语言和技术中，hook 的实现方式也有所不同。例如，在操作系统编程中，hook 可以通过修改系统调用表（System Call Table）实现，从而截获并修改操作系统的行为。在 JavaScript 中，hook 常常指的是 React 中的钩子函数（Hook Function），它允许开发人员在组件的生命周期和状态变化时执行自定义代码。
总的来说，hook 技术在编程中是非常常见和有用的，它可以帮助开发人员实现许多复杂的功能和扩展应用程序的灵活性。
什么叫做链式调用
链式调用（Chaining）是一种编程模式，它允许在同一行代码中连续调用多个方法或函数，从而使代码更加简洁和易读。
在 JavaScript 中，链式调用常常使用在操作数组、字符串和 DOM 元素等情境下，例如：
javascriptCopy codelet arr = [1, 2, 3, 4, 5];
let result = arr.map(x => x * 2).filter(x => x > 5).reduce((a, b) => a + b);
console.log(result); // 24
上面的例子中，我们对数组 arr 进行了 map、filter 和 reduce 操作，而这些操作都在同一行代码中连续进行，使得代码更加简洁和易读。
在实现链式调用时，每个方法都应该返回对象本身（或者其他可链式调用的对象），以便下一个方法能够直接调用。这种方法通常需要在类或对象的原型中实现，并且需要注意避免出现副作用或改变原始对象的情况。
