به طور کلی به زمان بین بارگذاری اولین محتوای قابل مشاهده صفحه (FCP) تا زمانی که صفحه به طور کامل تعاملی می شود (TTI)، زمان مسدود شدن یا TBT اطلاق می شود. در این بازه زمانی، رشته اصلی مرورگر (main thread) که وظیفه پردازش وظایف مختلف مربوط به بارگذاری صفحه را بر عهده دارد، توسط وظایف طولانی (Long Tasks) که بیش از 50 میلی ثانیه طول می کشند، مسدود می شود.
معیارهای حیاتی وب (Web Vital metrics)
این معیارها مجموعهای از فاکتورها هستند که گوگل برای سنجش تجربه کاربری (UX) هنگام بارگیری و تعامل با یک صفحه وب از آنها استفاده میکند. TBT یکی از این معیارها است.
TBT سی درصد از این امتیاز را تشکیل میدهد و 70 درصد باقیمانده شامل مجموعهای از معیارهای دیگر مرتبط با سرعت و عملکرد وبسایت شما است. برخی از این معیارها عبارتند از:
- First Contentful Paint (FCP): این معیار نشان میدهد که چه مدت طول میکشد تا اولین محتوای قابل مشاهده صفحه برای کاربر نمایش داده شود.
- Speed Index: این معیار سرعت کلی بارگذاری صفحه را بر اساس زمان درک شده توسط کاربر اندازهگیری میکند.
- Largest Contentful Paint (LCP): این معیار نشان میدهد که چه مدت طول میکشد تا محتوای اصلی صفحه به طور کامل بارگیری شود.
- Time to Interactive (TTI): این معیار نشان میدهد که چه مدت طول میکشد تا صفحه برای تعامل با کاربر (مانند کلیک، اسکرول و غیره) آماده شود.
- Cumulative Layout Shift (CLS): این معیار ناپایداری محتوا را در طول بارگیری صفحه اندازهگیری میکند و نشان میدهد که چقدر محتوا بعد از بارگیری اولیه صفحه جابجا میشود.
علاوه بر این معیارها، PageSpeed Insights ممکن است فاکتورهای دیگری را نیز در نظر بگیرد که به طور خاص برای وبسایت شما relevant هستند.
امتیاز عملکرد:
امتیاز عملکرد، معیاری است که توسط PageSpeed Insights گوگل برای ارزیابی سرعت و عملکرد کلی وبسایت شما استفاده میشود. این امتیاز از 0 تا 100 متغیر است و هر چه عدد بالاتر باشد، عملکرد وبسایت شما بهتر است.
زمان کل مسدود شدن (Total Blocking Time یا TBT) به عنوان یک معیار حیاتی وب (Web Vital metric) 30 درصد از امتیاز عملکرد را تشکیل میدهد و آن را به یکی از مهمترین معیارها برای بهینهسازی تبدیل میکند.
تاثیر TBT بر امتیاز عملکرد:
فرض کنید شما به تازگی یک وب سایت را باز کرده اید. تا زمانی که صفحه به طور کامل بارگیری نشود و با آن تعامل نداشته باشید، ممکن است احساس کند که سایت “گیر کرده” یا “بیپاسخ” است. این تاخیر در پاسخگویی به دلیل چیزی است که به آن زمان مسدود شدن یا TBT میگویند.
به طور خلاصه، TBT به طور خاص به مدت زمانی اشاره دارد که رشته اصلی مرورگر شما مسدود شده و قادر به پردازش ورودی های کاربر نیست. این اتفاق زمانی می افتد که وظایف سنگین (مانند تجزیه و تحلیل جاوا اسکریپت) در حال اجرا هستند و رشته اصلی را برای مدت طولانی (بیش از 50 میلی ثانیه) اشغال میکنند.
در این مدت، شما نمیتوانید اقداماتی مانند کلیک کردن روی دکمه ها، پیمایش صفحه یا وارد کردن متن را انجام دهید. هرچه TBT بیشتر باشد، تجربه کاربری شما کندتر و ناخوشایندتر خواهد بود.
مسدود شدن رشته اصلی چه مشکلی ایجاد می کند؟
زمانی که رشته اصلی مسدود می شود، مرورگر قادر به پاسخگویی به تعاملات کاربر مانند کلیک ماوس، اسکرول کردن صفحه و فشار دادن کلیدها نیست. این امر می تواند منجر به تجربه کاربری ناخوشایندی برای کاربران شود و آنها را از ادامه مرور صفحه منصرف کند.
نحوه محاسبه TBT به چه صورت است؟
مرورگر از رشتهای به نام رشته اصلی Main Thread برای پردازش کد HTML، CSS و جاوااسکریپت صفحه وب، ساختن ساختار صفحه (DOM) و مدیریت رویدادهای کاربر استفاده میکند.
هر زمان یکی از این وظایف در رشته اصلی بیش از ۵۰ میلیثانیه (میلیثانیه واحد اندازهگیری زمان است) طول بکشد، به عنوان یک وظیفه طولانی Long Task در نظر گرفته میشود.
زمانی که یک وظیفه طولانی در حال اجرا است، رشته اصلی مسدود میشود و نمیتواند به رویدادهای کاربر مانند کلیک، تایپ یا اسکرول پاسخ دهد.
کل زمان مسدود شدن رشته اصلی (یعنی مجموع زمانهای مسدود شدن توسط تک تک وظایف طولانی که بیش از ۵۰ میلیثانیه طول کشیدهاند) را کل زمان مسدود شدن یا TBT میگویند.
در تصویر، ۵ وظیفه روی رشته اصلی وجود دارد که تسک A، B و E جز وظایف طولانی به حساب میآیند، چراکه زمانشان بیشتر از ۵۰ میلیثانیه است. زمانهای مسدود شدن یا TBT برای هر وظیفه طولانی به شرح زیر است:
- تسک A که زمانی معادل 220 میلی ثانیه برای اجرا نیاز دارد، TBT معادل با ۱۷۰ دارد.
- تسک B که زمانی معادل 70 میلی ثانیه برای اجرا نیاز دارد، TBT معادل با 20 دارد.
- تسک A که زمانی معادل 145 میلی ثانیه برای اجرا نیاز دارد، TBT معادل با 95 دارد.
بنابراین، در این سناریو TBT برابر با مجموع زمانهای مسدود شدن وظایف طولانی است، یعنی ۲۸۵ میلیثانیه.
اگر فقط یک وظیفه ۵۰۰ میلیثانیهای روی رشته اصلی وجود داشت، TBT کل ۴۵۰ میلیثانیه میشد (۵۰۰ میلیثانیه کل زمان اجرا – ۵۰ میلیثانیه زمان مجاز برای یک وظیفه = ۴۵۰ میلیثانیه زمان مسدود شدن).
حال میدانیم که اگر زمان مسدود شدن یا TBT یک صفحه وب بالا باشد، به این معنی است که رشته اصلی برای مدت زمان زیادی مسدود شده و صفحه به ورودیهای کاربر پاسخگو نیست. این امر منجر به تجربه کاربری ضعیف و کندی صفحه میشود. به همین دلیل، پایین نگهداشتن TBT برای داشتن یک وبسایت با عملکرد بالا بسیار مهم است.
چرا TBT مهم است؟
TBT به عنوان یکی از معیارهای Core Web Vitals توسط گوگل معرفی شده است. این معیارها به منظور سنجش سرعت، ثبات و قابلیت اطمینان بارگذاری صفحات وب استفاده می شوند. گوگل از TBT برای ارزیابی سرعت پاسخگویی صفحات وب پس از درخواست کاربر استفاده می کند. بنابراین کاهش TBT می تواند مزایای متعددی برای وب سایت شما داشته باشد، از جمله:
- بهبود تجربه کاربری: کاربران از وب سایتی که به سرعت بارگذاری می شود و به تعاملات آنها به سرعت پاسخ می دهد، رضایت بیشتری خواهند داشت.
- افزایش رتبه سئو: گوگل TBT را به عنوان یکی از عوامل رتبه بندی سایت ها در نظر میگیرد. کاهش TBT می تواند به بهبود رتبه بندی شما در نتایج جستجو کمک کند.
- کاهش نرخ پرش: کاربران احتمالاً زمانی که وب سایت شما به سرعت بارگذاری شود و تجربه کاربری خوبی ارائه دهد، در آن بیشتر می مانند.
- افزایش نرخ تبدیل: احتمال اینکه کاربران در وب سایتی که TBT پایینی دارد، اقدام به خرید یا انجام سایر اقدامات مورد نظر شما کنند، بیشتر است.
با چه ابزارهای میتوان زمان مسدود شدن یا TBT را محاسبه کرد؟
- زمان کل مسدود شدن کمتر یا مساوی ۱۵۰ میلیثانیه: خوب – نیاز به اقدام نیست
- زمان کل مسدود شدن بین ۱۵۰ تا ۲۲۴ میلیثانیه: قابل قبول، اما نیاز به بهبود دارد
- زمان کل مسدود شدن بین ۲۲۴ تا ۳۵۰ میلیثانیه: بیشتر از حد توصیه شده
- زمان کل مسدود شدن بیشتر از ۳۵۰ میلیثانیه: بسیار بیشتر از حد توصیه شده
ابزارهای مختلفی برای اندازه گیری TBT وجود دارد، از جمله:
- PageSpeed Insights: این ابزار توسط گوگل ارائه شده است و به طور رایگان در دسترس است.
- WebPageTest: این ابزار یک ابزار منبع باز است که امکان اندازه گیری TBT از مکان های مختلف جغرافیایی را فراهم می کند.
- Lighthouse: این ابزار که درواقع یک اکستنشن برای مرورگر کروم است، توسط Chrome DevTools ارائه شده است و به شما امکان می دهد TBT و سایر معیارهای عملکرد وب سایت خود را اندازه گیری کنید.
چگونه می توان TBT را کاهش داد؟
راهکارهای مختلفی برای کاهش TBT وجود دارد، از جمله:
- بهینه سازی JavaScript: از minification و compression کدهای JavaScript خود استفاده کنید و از بارگذاری اسکریپت های غیرضروری خودداری کنید.
- کاهش زمان رندر شدن blocking resources: منابعی مانند CSS و فونت ها را به صورت غیر همزمان بارگذاری کنید و از lazy loading برای تصاویر استفاده کنید.
- استفاده از ابزارهای Performance: از ابزارهایی مانند Lighthouse و WebPageTest برای شناسایی و رفع مشکلات مربوط به TBT استفاده کنید.
- استفاده از شبکه تحویل محتوا (CDN): CDN شبکهای از سرورها است که محتوای شما را در مکانهای مختلف در سراسر جهان ذخیره میکند. این میتواند به کاهش زمان دانلود کد و منابع شما و TBT بهبود یافته برای کاربران در سراسر جهان کمک کند.
به طور خلاصه زمان کل مسدود شدن (Total Blocking Time یا TBT) یکی از معیارهای مهم برای سنجش سرعت بارگذاری وب سایت ها و تجربه کاربری است. با کاهش TBT میتوانید سرعت بارگذاری وب سایت خود را افزایش داده و تجربه کاربری را بهبود بخشید در در نتیجه رتبه بندی سئو خود را ارتقا دهید.