为何Chrome Dev Tools中TBT指标显示为Unavailable？

你的猜想完全正确，TBT显示为「Unavailable」确实是由TTI无法准确计算直接导致的，核心原因就是性能timeline的录制数据不足以识别到符合定义的5秒空闲静默窗口。

TBT（总阻塞时间）的计算依赖TTI（可交互时间）作为必要的终止节点：TBT统计的是从FCP（首次内容绘制）到TTI之间，所有长任务超出50ms部分的阻塞时长总和，一旦TTI无法得出计算结果，TBT自然没有对应数值。

而TTI的计算必须满足5秒静默窗口的判定规则，要求窗口内同时符合两个条件：

• 没有长度超过50ms的长任务执行
• 正在进行的网络请求数量不超过2个

除了录制数据时长不足的情况，以下两类场景也会导致该问题出现：

• 手动停止性能录制的时机过早，页面还未进入稳定可交互状态就结束了录制，无法采集到完整的静默窗口数据
• 页面本身存在持续运行的高频后台逻辑，比如毫秒级定时器轮询、不间断的动画帧计算，全程持续产生长任务，始终无法满足5秒静默窗口的要求

内容的提问来源于stack exchange，提问作者Cythilya