什么是总阻塞时间TBT

Total Blocking Time？

　　Total Blocking Time总阻塞时间(TBT)是衡量您在Google PageSpeed Insights(PSI)中得分的最重要指标（与LCP一起）。

　　这是为PSI-Lighthouse提供支持的技术更新的结果。具体地说它删除了First CPU Idle(FCI)和First Meaningful Paint(FMP)，同时添加了TBT、LCP和 CLS。本文，晓得博客为你介绍什么是总阻塞时间TBT。

　　推荐：什么是Interaction to Next Paint（INP）

什么是总阻塞时间(TBT)？

　　Total Blocking Time (TBT)是长任务（所有超过50毫秒的任务）阻塞主线程并影响页面可用性的时间量。它显示了页面在完全交互之前是如何无响应的。

　　基本上浏览器使用所谓的主线程来解析 HTML、构造 DOM、执行 CSS 和 JavaScript、处理用户事件以及执行其他重要任务。当这些任务中的任何一个运行时间超过50毫秒（也称为长任务）时，主线程被视为“阻塞”，因为浏览器无法中断正在进行的任务。

　　更重要的是，作为用户体验指标，Total Blocking Time 占 Lighthouse 性能得分的30%。这使它成为优化的首要指标！总阻塞时间是衡量WordPress外贸建站中网站响应能力的重要性能指标。当任务长度超过50毫秒时，它是首次内容绘制(FCP)和交互时间(TTI)之间所有时间段的总和。分数始终以毫秒为单位。

　　推荐：什么是网站缓存?WordPress网站怎么使用缓存？

Google如何衡量TBT

　　为了清楚地理解这些，让我们看一个例子。如果主线程要执行四个任务，每个任务所花费的时间如下：

• 任务 1 ——58 毫秒。
• 任务 2 ——45 毫秒。
• 任务 3 ——125 毫秒。
• 任务 4 ——200 毫秒。

　　那么阻塞时间，即50ms后执行每个任务所花费的时间，为：

• 任务 1 ——8 毫秒。
• 任务 2 ——0 毫秒。
• 任务 3 ——75 毫秒。
• 任务 4 ——150 毫秒。

　　这个网页的总阻塞时间将是每个任务的阻塞时间的总和，即 8 + 0 + 75 + 150 = 233 ms，根据 Lighthouse 的评级，这是一个网页的好分数，因为它小于 300 毫秒。

　　主线程上的少量任务并不一定意味着低阻塞时间。相反，大量的任务并不一定会导致大量的阻塞时间或糟糕的用户体验。

　　注意：请记住，只有50ms以上的时间才被认为是阻塞时间。

　　推荐：什么是Trackback？WordPress怎么禁用Trackback

TBT和TTI的区别

　　乍一看，TBT听起来就像是Time To Interactive(TTI)。但是，虽然相似，但这两个指标最终衡量的是不同的事物。

　　TTI告诉您页面完全交互需要多长时间，以秒为单位。要被认为是交互式的，页面必须显示有用的内容并在不到50毫秒的时间内响应用户输入。此外，必须为大多数页面元素注册事件处理程序。

　　总阻塞时间TBT是当访问者在此期间尝试与页面交互时，会出现延迟，因为主线程很忙。TBT有助于量化这些延误的严重程度，让您详细了解交互性受长任务影响的严重程度，而不是指出页面何时变为交互性。

　　推荐：什么是Brotli压缩?网站开启Brotli压缩的好处

测量总阻塞时间的工具

　　我们推荐两种不同的工具来衡量TBT和使用Lighthouse技术的性能。

　　Google PageSpeed Insight(PSI)：

　　GTmetrix：

　　这两种工具都提供TBT分数，但数字略有不同，您可能已经注意到了。这主要是由于各种因素造成的，包括Lighthouse实施、测试方法、测试位置等。

　　推荐：8个免费好用的外贸网站速度测试工具

检查哪些任务会伤害TBT

　　Chrome开发工具性能和Lighthouse审计可以为您提供有关主线程上的长任务的信息。

　　转到您要分析的页面。右键单击并选择“检查”。之后，单击“Performance性能”。单击“重新加载”按钮并等待Chrome执行它的操作。

　　您将获得有关页面执行情况的详细分析。会看到以不同颜色绘制的任务。如果您看到一个带有红色小覆盖的灰色任务，则表明您找到了一个长任务。当你将鼠标悬停在它上面时，你会看到它在主线程上占用了多少时间。

　　另一种选择是使用Chrome中的Lighthouse审核来分析您网站的总阻塞时间。再次，右键单击，选择“检查”。这次去“Lighthouse”。

　　选择您要测试的类别，然后单击“生成报告”。您可能会为您的网站获得大量建议。他们中的很多人都可以以一种或另一种方式帮助TBT。

　　注意：该报告不会为您提供任务的细分，但会指出具体的性能问题。

　　推荐：什么是SSH？

总结

　　以上是晓得博客为你介绍的什么是总阻塞时间TBT的全部内容，TBT绝对是您在优化网站性能时需要关注的指标。Total Blocking Time是Google的Core Web Vitals计划的一部分，会影响您网站的自然排名，因此需要在WordPress建站 和 SEO网站优化中考虑到。

　　推荐：[最新版]FluentCRM Pro插件下载WordPress邮件营销自动化插件