کل زمان انسداد Total Blocking Time یکی از معیارهای پایش شده در قسمت عملکرد در گزارش فانوس دریایی لایت هاوس Lighthouse Report گوگل است. این معیار در گزارش پیج اسپید اینسایتس PageSpeed Insights گوگل هم قابل رویت است. هر یک از معیارها نمایشی از سرعت و عملکرد بارگذاری صفحه وب شماست.
در گزارش لایت هاوس Lighthouse معیار TBT یا کل زمان انسداد Total Blocking Time بر حسب میلی ثانیه msec نمایش داده می‌شود.
کل زمان انسداد TBT چه چیزی را می سنجد؟
این معیار، کل زمانی را که یک صفحه قادر به دریافت ورودی از کاربر نیست را می سنجد. به عبارت بهتر معرف مدت زمانی است که صفحه دریافت ورودی از کاربر را مسدود کرده است.
ورودی کاربر می تواند تاچ کردن صفحه لمسی و یا فشردن یک کلید بر روی صفحه کلید و مشاهده واکنش مقتضی از طرف صفحه باشد.
این زمان کل از جمع همه تسک‌های طولانی از اولین نمایش محتوایی First Contentful Paint تا مدت زمان تا تعامل Time to Interactive به دست می‌آید. هر تسکی که بیش از ۵۰ میلی ثانیه طول بکشد یک تسک طولانی Long Task در نظر گرفته می‌شود.
مدت زمانی که تسک بیش از ۵۰ میلی ثانیه برای اجرا سپری میکند، بخش انسداد یا Blocking در نظر گرفته می‌شود. از مجموع زمان این بخش های انسداد، معیار کل زمان انسداد Total Blocking Time حاصل می‌شود.
تسک طولانی Long Task چیست؟
تسک های طولانی کدهای جاوا اسکریپتی هستند که رشته اصلی Main Thread را برای زمان طولانی به انحصار خود در می‌آوردند.
با این کار، رابط کاربری بی حرکت شده و اصطلاحا به حالت freeze در می آید. استفاده از تسک های طولانی در بارگذاری صفحه اثرات مخربی دارد. گرچه در مواردی چاره‌ای جز استفاده از آنها نداریم، بهتر است موارد استفاده را به حداقل ممکن کاهش دهیم.
این تسک ها با گیر انداختن رشته اصلی Main Thread سبب می شوند تا صفحه به ورودی کاربر هیچ واکنشی نشان ندهد. در عین حال که صرفا به ظاهر صفحه آماده استفاده است، کاربر قابلیت تعامل با آن را ندارد.
مدت کوتاهی است که گوگل به Interactive بودن واقعی و عملیاتی صفحه توجه ویژه ای کرده و معیار کل زمان انسداد Total Blocking Time نیز حاصل این توجه ویژه است.
با حفظ مدت زمان اجرای تسک ها زیر آستانه ۵۰ میلی ثانیه، یک پاسخ قابل مشاهده از طرف صفحه ظرف ۱۰۰ میلی ثانیه (یعنی ۲ برابر زمان آستانه) قابل ارائه خواهد بود.
اگر زمان تسک از ۵۰ میلی ثانیه تجاوز کند، ارتباط معنایی بین عمل کاربر و عکس العمل صفحه از بین می رود. این موضوع احساس نارضایتی زیادی در کاربر ایجاد کرده که احتمالا منجر به ترک صفحه و بستن آن می‌شود.
کاربران با بستن صفحاتی که به تازگی باز کرده‌اند معیار نرخ پرش Bounce Rate شما را افزایش می‌دهند که معیار مهمی در ارتقای جایگاه صفحات در لیست نتایج جستجو و سئو SEO است.
نحوه محاسبه امتیاز کل زمان انسداد Total Blocking Score
معیار امتیاز کل زمان انسداد در مورد صفحه شما از تقسیم کل زمان انسداد صفحه شما بر میانگین ۱۰۰۰۰ سایت برتر بر روی موبایل به دست می‌آید.
نحوه تفسیر رنگی از امتیاز زمان انسداد به شرح زیر است:
- از ۰ تا ۳۰۰ رنگ سبز و نشان دهنده سرعت بالا و عملکرد مناسب
- از ۳۰۰ تا ۶۰۰ رنگ نارنجی و نشان دهنده سرعت عادی و عملکرد قابل قبول
- از ۶۰۰ به بالا رنگ قرمز و نشان دهنده سرعت پایین و عملکرد ضعیف
ارتقای امتیاز TBT یا زمان کل انسداد
تجربه شخصی من در آنالیز و تحلیل بارگذاری صفحات وب که طی چندین سال کسب کردم نشان می دهد که مهمترین عوامل ایجاد تسک طولانی Long Task در صفحه وب عبارت اند از:
۱- بارگذاری و تفسیر و اجرای کدهای جاوا اسکریپت غیر ضروری
در بسیاری از موارد حین آنالیز رشته اصلی Main Thread مشخص می شود که صفحه کلاینت دارای کدهای جاوا اسکریپتی است که برای بارگذاری صحیح صفحه لازم نیستند. فراموش نکنید، تنها کدهای جاوا اسکریپتی را حین بارگذاری صفحه فراخوانی و اجرا کنید که به پرداخت Render محتوای DOM کمک می‌کنند. در غیر اینصورت با استفاده از defer و async و روش‌های اصولی توسعه فرانت، از اجرای همزمان آنها با رشته اصلی پرداخت صفحه جلوگیری کنید.
۲- کدهای جاوا اسکریپت غیر بهینه
کدهای غیر بهینه ای که با کپی و پیست از اینترنت از صفحه وب شما سر در آورده اند آفت بعدی هستند. به این منظور قطعه کدی را تصور کنید که برای اضافه کردن یک attribute به یک element از DOM نوشته شده است:
document.querySelectorAll('a')
چنین کدی ممکن است صدها المان a را انتخاب میکند. انجام چنین فرآیندی زمانبر و مستلزم استفاده از منابع سیستم نظیر حافظه و پردازنده است. فاجعه آنجا رخ می‌دهد که روی چنین سلکتوری، یک لوپ زده شود و نهایتا اضافه کردن attribute بر روی تنها ۱۰ مورد از element ها انجام شود.
پرهیز از استفاده از چنین کدهای جاوا اسکریپت غیر بهینه ای سبب ارتقای امتیاز زمان کل انسداد TBT شما خواهد شد.
افزایش سرعت وردپرس
اگر صاحب یک کسب و کار اینترنتی هستید و به دنبال افزایش سرعت سایت وردپرس بهتر است بدانید که افزایش سرعت برای سیستم مدیریت محتوای وردپرس کار پیچیده ای نیست. کافی است با کمی دانش و مطالعه و کمک گرفتن از یک مشاور آگاه سرعت وردپرس خود را تا حد امکان افزایش دهید.
برای یک نمونه سایت pmpr را در ابزار Google PageSpeed Insights تست کنید و سرعت قابل دستیابی یک سایت با وردپرس را ببینید.
