Total Blocking Time چیست؟
Total Blocking Time چیست؟
خب اکنون Total Blocking Time یعنی چی؟ این ترازو یک جورهایی مرتبط با تعامل استفاده کننده با برگه میشه. به کل فرصتهای دربین FCP و TTI که main thread به هم ریخته بوده و بهعبارت عالی بلاک گردیده، Total Blocking Time یا این که کل مجال بلاک شدن گفته میشه. میدونم یه خرده طاقت فرسا شد. پس بیایید نخستین مضمون main thread رو با هم سئو در مشهد رسیدگی فرمائید.
Total Blocking Time در جی تی متریکس
Main Thread چیست؟
وقتی که برگه وب سایت در درحال حاضر بار گذاری شدنه، لازمه منابع متعددی فراخوانی بشن و وظایف و عملیات گوناگونی پشت برگه صورت میده. کارهایی مثل تجزیه پوشههای HTML و CSS ، ساختن DOM (نوشتهیعلمی DOM چیست) ، اجرای فولدرهای JavaScript و… به زبون خیلی معمولی، مرورگر از main thread برای اجرای این امور یا این که درخواستهای استفاده کننده (مثل کلیک کردن) به کارگیری خدمات سئو در مشهد میکنه.
یک نمونه بهتر برای ادراک عالی:
main thread رو مثل گارسون رستوران در لحاظ بگیریم. این گارسون وظایف مختلفی مثل تصاحب کردن توصیهها، تحویل پیشنهاد به آشپزخانه، بردن طعام رمز میز، نظافت کردن میزها و… داره. هم اکنون اگه یکیاز شغل های این گارسون بیش تر از حد ارتفاع بکشه، چه اتفاقی میافته؟ درسته، به شغل های اصلی دیگه نمیرسه. پس بایستی طوری وظایف گارسون (main thread) رو پیاده سازی کنیم که پژوهش به یک عمل خاص، وقتش رو بیشتراز حد نگیره.
نمونه پایین خوب بهتون امداد میکنه:
هم اکنون خواسته از بلاک شدن main thread چیه؟ هروقت یکیاز وظایفی که main thread برعهده داره بیشتراز ۵۰ میلی ثانیه ارتفاع بکشه، میگیم main thread بلاک گردیده. هم اکنون دربین فرصتهای FCP و TTI ، آحاد فرصتهایی که main thread بلاک گردیده رو به حساب آوردن میکنیم و با هم عده میکنیم تا TBT یا این که Total Blocking Time رو بهدست بیاریم. (درباره TTI یا این که Time to Interactive چیست در نشست ۱۰ کلام کردیم)
(منبع عکس)
عکس بالا خیلی بدیهی داره میگه، ۴ تا وظیفه (Task) قرار است جاری ساختن بشه حال برای مثال یک Task میتونه تلاوت پوشه JS باشه، در اصل فولدرهای JS سبب ساز میشن مجال TBT بیشتر باشه. هم اکنون به جزء وظیفه دوم سایر وظیفه ها یعنی یک، سه و چهار بالای ۵۰ میلی ثانیه ارتفاع کشیده و با رنگ قرمزرنگ معین کردیم، توده تمامی این موردها میشه TBT یا این که همون Total Blocking Time که گفتیم.
چه چیزهایی در TBT تاثیر دارن؟
تجزیه و ارزیابی برگه HTML
سروکله زدن با پوشه CSS
سروکله زدن با پوشه JS (این از کلیه اصلیتره)
ساختن DOM
ساختوساز layout tree
و ….
میزان TBT هم یکیاز معیارهای استفاده کننده پایه GTmetrix تازه محسوب میشه. چراکه تو این زمان مجال (یعنی هنگامی main thread بلاک گردیده باشه) درخواستها و ورودیهای استفاده کننده اعمال نمیشه. برای مثال اگه استفاده کننده روی دکمهای کلیک کنه، اتفاقی نمیافته. براین اساس استفاده کننده گمان میکنه وبسایت ما مشکلی داره و از کاغذ بیرون میشه و تجارب کاربری بدی صورت میگیره.
مقدار Total Blocking Time در گزارش Performance چقدر باشه خوبه؟
میزان TBT مقدار ۲۵٪ از امتیاز Performance در GTmetrix رو تشکیل میده و این نشون دهنده عنایت بسیار زیاد این واحد سنجش کلیدی است. طریق نمرهدهی GTmetrix به TBT ، بهاین صورته:
۱۵۰ میلی ثانیه یا این که کمتر : بهتر
میان ۱۵۰ تا ۲۲۴ میلی ثانیه: قابل قبول، ولی مستلزم seo
میان ۲۲۴ تا ۳۵۰ میلی ثانیه: مقداری وقت گیرخیس از حد استاندارد
بیشتر از ۳۵۰ میلی ثانیه: خیلی وقتگیرخیس از حد استاندارد
چطوری TBT یا این که Total Blocking Time رو با صرفه کنیم؟
کاهش Total Blocking Time تا حد متعددی به اجرای JavaScript بستگی داره. براین اساس seo اجرای فولدرهای JavaScript سبب بهبود TBT گردد. همینطور seoهای فاکتور TTI مقداری یاری میکنه اما خیر مدام. اعتنا به مفاد ذیل هم منجر کاهش Total Blocking Time در کاغذ ما میشه:
کاهش مجال اجرای JavaScripts
سئو main thread
حذف پوشههای JavaScript سوای به کار گیری
جایگزین کردن کتابخانههای هنگفت JavaScript با مفاد کوچکتر
نکته قابل توجه: main-thread مرتبط با JS یا این که جاوااسکریپت میباشد، دوستان تامل میکنن که در حالتی که فولدر های جاوااسکریپت رو ذکر فشرده سازی بکنن TBT عالی میشه البته می بایست بگم نه خوب نمیشه تنها به قولی ماستمالی میشه. اما کسی منکر seo پوشههای JS یا این که CSS وجود ندارد البته این شیوه تفکر که فشرده کنیم تا خوب بشه برای قدیم بود، بایستی پوشههای JS که وب سایت به کارگیری نمیکنه رو کلا برای مدام از تارنما منزه فرمایید، خیر اینکه بیاین کلیه رو بنذارید یک جا. پس نیاز دارید بدید اپلیکیشن نویس این عمل خوش یمن براتون اعمال بده.
در ضمن: طبق تحقیق که کردم defer کردن فولدرهای JS یا این که CSS یاری متعددی به بهبود TBT هم نمیکنه، اما شاید در برگه مطلوب باشه و اجرای JS در پایان قرار بده اما در کار ما اثر متعددی ندیدیم.
همچنین دو خطای اساسی در نصیب Structure داریم که تاثیر بدون واسطه داره و سفارش میشه بخونید.
خطای Avoid long main-thread tasks
خطای Avoid an excessive DOM size
با این اکنون اندیشه نکنید خیلی معمولی میتونید این فاکتور رو بهبود بدید و می بایست بدونید برای سئو اون بهتدریج بالای ۲۰ گزینه موثر است که ما تا قبل از این در مقاله ها گذشته گفتیم.
توده بندی Total Blocking Time
میزان Total Blocking Time یکیاز مهمترین معیارهای GTmetrix تازه میباشد که اثر متعددی روی ارتقا امتیاز Performance داره. TBT به رسیدگی وقتی میپردازه که main thread به جهت شغل های زمان بر (Long Tasks) بلاک گردیده بوده و درنتیجه مرورگر نمیتونسته به درخواستهای مخاطب جواب بده. هر فرصت که main thread بیشتراز ۵۰ میلی ثانیه سرگرم یک عمل (Task) بشه، سایر این فرصت جزء TBT محسوب میشه. ترازو Total Blocking Time مشابه میزان First Input Delay در Web Vitals میباشد