概述Navigation Timing v2(`PerformanceNavigationTiming`)为主文档导航过程提供高分辨率时间点,包括网络阶段、解析阶段与事件阶段。结合 RUM 可定位首包延迟(TTFB)与 DOM 解析/事件处理瓶颈。关键时间点`responseStart`:首字节到达(TTFB),受网络与后端处理影响。`domContentLoadedEventStart/End`:DOM 解析完成前后,衡量 DCL 处理耗时[参考1,3,5]。其它常用点:`requestStart`、`responseEnd`、`loadEventStart/End`。采集与分析通过 `performance.getEntriesByType('navigation')` 读取 `PerformanceNavigationTiming`;记录 `responseStart` 与 `domContentLoadedEventStart/End`,计算 DCL 事件耗时与首包时延[参考3]。结合资源时序(Resource Timing)与主线程阻塞(Long Tasks)定位解析与脚本执行瓶颈。优化建议降低 TTFB:后端性能、缓存策略、CDN、压缩与连接复用。缩短 DCL:减少阻塞脚本与同步任务,按需加载与代码拆分。参考与验证[参考1]MDN:`PerformanceNavigationTiming`(DCL 事件时间与接口):https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigationTiming[参考2]W3C:Navigation Timing Level 2 规范(时序定义):https://www.w3.org/TR/navigation-timing-2/[参考3]MDN:Navigation timing 指南(采集方法与 DCL 说明):https://developer.mozilla.org/en-US/docs/Web/API/Performance_API/Navigation_timing[参考4]MDN:导航与资源时序综述(解析流程与事件阶段):https://developer.mozilla.org/en-US/docs/Web/Performance/Guides/Navigation_and_resource_timings[参考5]W3C 编辑稿:Navigation Timing 2(DCL start/end 定义):https://w3c.github.io/navigation-timing/关键词校验关键词覆盖导航时序与 DCL/TTFB,与正文一致。

发表评论 取消回复