Navigation Timing API 返回 PerformanceNavigationTiming 对象数组，含DNS、TCP、请求响应、DOM渲染等各阶段高精度时间戳；需用 performance.getEntriesByType('navigation')[0] 安全获取首航数据，并校验 entry.name === location.href，避免 iframe 干扰。
Navigation Timing API 返回什么数据
它不是函数，而是浏览器原生提供的 performance.navigation（已废弃）和更可靠的 performance.getEntriesByType('navigation')。现代页面应只依赖后者，返回一个数组，每个元素是 PerformanceNavigationTiming 对象，包含从重定向、DNS 查询、TCP 连接、SSL 握手、请求发送、响应接收，到 DOM 解析、资源加载等全部阶段的时间戳。
关键点：必须在页面加载完成前读取，否则可能被清空或截断；且仅对同源导航有效（跨域 iframe 的导航条目会被省略部分字段，redirectStart/redirectEnd 等为 0）。
如何安全获取首次导航的 timing 数据
不能直接在 DOMContentLoaded 或 load 事件里调用 getEntriesByType('navigation') 并假设第一个就是当前页——如果页面有预加载、iframe 导航或 SPA 路由切换，结果可能错乱。
- 优先用
performance.getEntriesByType('navigation')[0]，但需检查是否存在且entry.name === location.href（避免匹配到 iframe 的导航） - 更稳妥的做法是监听
navigation类型的performance.entry，但该事件仅在 Chrome 120+ 支持，兼容性差 - 实际项目中建议在
内尽早执行：const navEntries = performance.getEntriesByType('navigation');<br>const firstNav = navEntries.length > 0 ? navEntries[0] : null;
计算各阶段耗时要注意单位和零值
所有时间字段都是毫秒级浮点数，但很多字段在不适用时返回 0（比如没有重定向时 redirectStart 和 redirectEnd 都是 0），直接相减会得到错误的“0ms”结论。
立即学习“前端免费学习笔记（深入）”；
- 判断是否发生某阶段：用
entry.redirectStart > 0，而非entry.redirectStart !== 0（因为时间戳可能恰好是 0） - DNS 查询耗时 =
entry.domainLookupEnd - entry.domainLookupStart，若两者均为 0，说明走的是本地缓存或 hosts，不应计入 DNS 延迟 - TTFB =
entry.responseStart - entry.requestStart，但requestStart在某些浏览器（如 Safari）可能为 0，此时可用entry.fetchStart替代 - 首字节时间（TTFB）和白屏时间（
entry.domLoading - entry.fetchStart）才是业务最常监控的两个指标
为什么在 React/Vue SPA 里拿不到准确的 navigation timing
因为 SPA 路由跳转不会触发新的 navigation 条目，getEntriesByType('navigation') 只返回页面首次加载那次记录。后续路由变化属于 JS 控制的视图更新，不在 Navigation Timing 范围内。
解决思路不是硬套这个 API，而是改用 performance.mark() + performance.measure() 手动打点：
- 在路由
beforeEach（Vue Router）或useEffect（React）中调用performance.mark('route-start') - 在组件挂载/数据加载完成时打
performance.mark('route-end') - 再用
performance.measure('route-load', 'route-start', 'route-end')获取耗时 - 注意：这些自定义 mark 不会上报到
performance.getEntriesByType('navigation')，得单独收集
Navigation Timing 是给“完整页面导航”用的，不是通用性能打点工具；混淆使用会导致数据失真，尤其在混合了 SSR 和 CSR 的项目里，首屏和后续导航的统计逻辑必须分开设计。
