سرعت سایت عاملی بسیار حیاتی برای باقی ماندن در صفحات جستجو است و همه سعی میکنند به هر روشی که میتوانند این کار را انجام دهند. استفاده از جی تی متریکس جدید یکی از این روشهاست. در این مقاله سعی کرده ایم آپدیت جدید GTmetrix و طرز استفاده از این سایت را توضیح دهیم.
جی تی متریکس چیست؟
جی تی متریکس سایتی است که راهکارهایی را برای افزایش سرعت سایت ارائه میدهد. برای این کار به سایت gtmetrix.com مراجعه کنید و خیلی ساده آدرس سایت مورد نظر را وارد کنید.
آپدیت جدید GTmetrix به شما میگوید چه چیزهایی در سایت سرعتشان خوب و چه چیزهایی نیست. در ادامه در مورد جی تی متریکس جدید توضیح خواهیم داد.
فهرست مطالب
چگونه از جی تی متریکس جدید استفاده کنیم؟
نسخه اصلی آپدیت جدید GTmetrix کاملاً رایگان است و شما میتوانید با ساخت یک حساب، به گزینه های بیشتری دسترسی پیدا کنید. اگر حساب کاربری ایجاد کنید میتوانید از گزینه های تجزیه و تحلیلِ بیشتری استفاده کنید.
اولین کار در جی تی متریکس جدید توانایی انتخاب مکانی است، که میخواهید URL خود را در آن آزمایش کنید. مکان فیزیکی شما انتخاب میشود و بسیار مهم است چون مربوط به جایی است که سایت شما میزبانی میشود. مکانهای موجود در حال حاضر شامل:
- دالاس، آمریکا
- هنگ کنگ، چین
- لندن، انگلستان
- بمبئی، هند
- سیدنی، استرالیا
- سائو پائولو، برزیل
- ونکوور، کانادا
مهم ترین چیزی که باید در آپدیت جدید GTmetrix بدانید این است که جی تی متریکس جدید سعی کرده بیشتر از Google Lighthouse پیروی کند و دیگر فقط روی سرعت متمرکز نیست و چیزهای دیگری را هم مورد بررسی قرار میدهد.
Lighthouse چیست؟
Lighthouse یکی از ابزارهای گوگل برای افزایش کیفیت صفحات وب است که در آپدیت جدید GTmetrix هم، از آن پیروی شده است. برخلاف ابزار قدیمی Google PageSpeed Insights، لایت هاوس یک سایت را به روشهای مختلف تحلیل میکند.
این ابزار جستجو میکند تا بفهمد متغییرهای مهم داخل سایت شما در چه وضعیتی هستند؛ مثلاً چیزهایی مثل اجرا، سئو، تجربه ی کاربر، دسترسیپذیری و وب اپلیکیشن پیش رونده را بررسی میکند.
میتوانید از آن برای آزمایش هر نوع URL، سئو سایت، برنامه های وب و موارد دیگر استفاده کنید.
لایت هاوس برای تعریف معیارهای خود، صرفاً بر اندازه گیری سرعت بارگذاری صفحه متمرکز نیست بلکه تمام معیارهای آن بر ارزیابی تجربه ی کاربران صفحه وب متمرکز است.
در ضمن، بیشتر بازدیدکنندگان سایت به این فکر نیستند که چه مدت طول میکشد تا کل سایت شما بارگیری شود، بلکه به دنبال این هستند که هر چه سریع تر بتوانند در سایت اسکرول کنند و با سایت تعامل داشه باشند.
Google این معیارها را Core Web Vital مینامد. آپدیت جدید GTmetrix هم این Core Web Vitalها را دارد.
جی تی متریکس جدید
در اصل آپدیت جدید GTmetrix توضیح داده که PageSpeed and YSlow قبلا توانایی خوبی در تحلیل داشت، اما تمرکز اصلی آنها فقط روی ظاهر سایت بوده یعنی همان چیزی که مخاطبان میدیدند.
اگر در گذشته امتیاز خوبی برای PageSpeed / YSlow کسب میکردید اما سرعت بارگذاری پایین بود؛ در آپدیت جدید جی تی متریکس دیگر همچین اتفاقی نمیافتد، چون قبلاً امتیازی که دریافت میکردید برحسب میزان خوب ساخته شدنِ ساختار صفحه شما تغییر میکرد، نه بر حسب سرعت نمایش سایت به کاربر!
این نمای کلی جدید سایت جی تی متریکس جدید است و در ادامه به تحلیل جزییات آن میپردازیم.
جدول اول سمت چپ، GTmetrix Grade: این گزینه سایت را از نظر ساخت و کدنویسی و همچنین از لحاظ عملکرد بررسی میکند. Performance و Structure در آپدیت جدید GTmrtrix روی امتیاز نهایی تاثیر میگذارند و به سایتها از رتبه ی A تا F رتبه میدهد.
جزئیات جی تی متریکس جدید
Performance
عواملی که بر امتیاز Performance در آپدیت جدید Gtmetrix تاثیر میگذارند:
1. کیفیت بارگذاری:
- اولین چیزی که کاربر میببیند.
- نمایش لحظه ای سایت یا چیزی که کاربر هر لحظه میبیند.
- بزرگترین چیزی که کاربر در سایت ببیند که ممکن است تصویر باشد یا یک متن.
2. تعامل:
- زمانی که طول میکشد تا بتوان روی صفحه کاری انجام داد.
- زمان بلاک بودن تعامل که یعنی زمان انتظار برای تعامل کردن و اسکرول کردن در صفحه.
3. ثبات بصری:
در ابزار Lighthouse هرچقدر ثبات اولیه با شکل نهاییِ صفحه یکسان باشد بهتر است پس در جی تی متریکس جدید نیز چنین چیزی صدق میکند.
شاید برایتان پیش آمده باشد، وارد سایتی شوید، حس کنید صفحه کاملا بارگذاری شده و بخواهید در صفحه کاری انجام دهید اما قسمتهایی شروع به تکان خوردن کنند و جابه جا شوند!؟
جایگزین Tab Timings در جی تی متریکس جدید تب Performance است و به رنگهای سبز، سبز روشن، نارنجی و قرمز در موارد مختلف به سایت امتیاز میدهد.
جزئیات گزینه Performance
(First Contentful Paint (FCP
در آپدیت جدید GTmetrix گزینه FCP به معنای اولین چیزی است که سایت به کاربر نمایش میدهد.
(Speed Index(SI
این مورد در آپدیت جدید GTmetrix معیاری برای بارگذاری صفحه است که به شما نشان میدهد محتوای صفحه با چه سرعتی کامل میشود. اسپید ایندکس میانگینِ زمانی است که قسمتهای قابل مشاهده ی صفحه، نمایش داده میشود.
بر حسب میلی ثانیه بیان میشود و هرچه امتیاز پایین تر باشد، بهتر است.
(Largest Contentful Paint (LCP
LCP در آپدیت جدید GTmetrix مدت زمانی است که یک صفحه بارگیری میشود. نکته ای که باید توجه داشته باشید این است که زمان نتایج “خوب” 2 ثانیه و کمتر است؛ این نشان میدهد که گوگل چه مقدار روی بهبود بیشتر سرعت سایت تمرکز کرده است.
(Time to Interactive(TTI
به معنای زمان تعامل است. یعنی زمانی که کاربر میتواند پس از ارائه صفحه با آن ارتباط برقرار کند. برای مثال، پس از کلیک یک خریدار بر روی دکمه افزودن به سبد خرید، TTI مدت زمان لازم برای استفاده از عناصر صفحه بعدی را اندازه میگیرد.
(Total Blocking Time(TBT
این گزینه در آپدیت جدید GTmetrix به معنای زمان مسدود کردن کل است و نشان دهنده ی مقدار کل زمان بین FCP و TTI را اندازه گیری میکند.
(Cumulative Layout Shift (CLS
به معنای میزان پایداری صفحه در هنگام بارگیری است. آیا هنگام بارگیری صفحه، با شروع بارگیری تصاویر و فیلمها، مطالب تغییر مکان میدهند یا اینکه نسبتاً ثابت میمانند؟
تب Browser Timings در جی تی متریکس جدید نشان میدهد، یک سایت از زمانی که به آن درخواست فرستاده میشود تا لحظه ای که نتیجه ی نهایی نمایش داده شود برای هر کدام از درخواستها چقدر زمان صرف میشود!
Structure
عواملی که بر امتیاز Structure در آپدیت جدید GTmetrix تاثیر میگذارند:
طبق توضیحی که جی تی متریکس جدید داده این بخش از ساختارهای مختلف و متنوعی تشکیل شده است. هدف آن محاسبه عملکرد بهینه ی صفحه است و در ادامه یک سری ساختار معرفی کرده که باید زیر نظر داشته باشیم.
در توضیحات زیر این موارد را برای شما به فارسی تغییر داده ام و هر کدام که به نظر ممکن است گنگ باشد را توضیح دادم. مثلاً در بالا به ما گفته است که:
زمان پاسخ اولیه سرور را کاهش دهید
با رنگ قرمز مشخص کرده که بزرگترین مشکل همین مورد است. به ترتیب از بالا به پایین از اهمیت موارد و مشکلات کاسته میشود.
حذف منابع مسدود کننده رندر (Render-Blocking)
رندر به معنای بارگذاری است، بنابراین اگر چیزی مانع رندر میشود، به این معنی است که سایت نمیتواند تا جایی که میتواند سریع بارگذاری شود.
همانطور که میدانید همه مضامین و افزونه های مورد استفاده در سایت وردپرس شما مثلا پرونده های (JS) و (CSS) به فرانتاند اضافه میشوند.
وقتی یک کاربر سعی دارد از طریق مرورگر خود به سایت شما دسترسی پیدا کند، ابتدا همه این اسکریپتها قبل از اینکه سایت شما نمایان شود برای او بارگیری میشوند.
به طور کلی، قبل از اینکه کاربر بتواند محتوای اصلی را ببیند، مرورگر باید یک صف از پرونده های JS ,CSS و HTML را بارگیری کند.
اگر تعداد زیادی از این اسکریپتهای JS دارید که بارگیری محتوای اصلی HTML را به تأخیر میاندازد به زودی باعث کند شدن سایت شما شده و کاربران را مجبور به انتظار میکند.
اگر سرعت بارگذاری سایت شما تحت تأثیر مثلا JavaScript باشد، به این قطعه ها کد Render Blocking JavaScript گفته می شود.
- از شبکه تحویل محتوا یا CDN استفاده کنید.
- برای بهبود اسکرول کردن از Passive Listeners) Passive Listeners یک ابزار وب جدید است که اسکرول کردن صفحه را بهبود میبخشد.) استفاده کنید.
- برای همه منابع از HTTP / 2 استفاده کنید.
- از تصاویر در اندازه ی مناسب استفاده کنید.
نکته: در جی تی متریکس جدید امتیاز Structure روی امتیاز Performance به طور مستقیم تاثیر نمیگذارد اما در نهایت بهبود ساختار صفحه شما به بهبود عملکرد صفحه کمک میکند.
این تب در آپدیت جدید GTmetrix نشان میدهد کجای کار مشکل دارد و باید رفع شود. اگر خطا داشته باشیم، کدی که در سایت باعث خطا شده را به ما نشان میدهد. در نسخه ی قبلی این مشکل را نمیتوانستیم به خوبی تحلیل کنیم و شاید نیاز به یک برنامه نویس هم داشتیم.
تبهای دیگری هم هستند که مثل قبل باقی مانده اند (Waterfall ,Video و History ) اما در ادامه به توضیح کاربرد آنها نیز خواهیم پرداخت.
Web Vitals
در جی تی متریکس جدید این تب شامل: (Largest Contentful Paint (LCP و (Total Blocking Time(TBT و (Cumulative Layout Shift (CLS است که بالا در قسمت پرفورمنس هر یک را توضیح دادیم.
Summary
این تب در آپدیت جدید GTmetrix اصلی ترین بخش مرتبط و تحلیل دیتا برای هر وبمستر است.
بخش Speed Visualization
همانطور که در تصویر پایین مشخص است، در آپدیت جدید GTmetrix به صورت دقیق میتوانیم ببینیم که در هر ثانیه و لحظه کاربر چه چیزی را مشاهده میکند و چه زمانی اولین نمای صفحه، زمان فعال شدن تعامل و … اتفاق میافتد.
بخش Top Issues
این بخش ایرادات و مشکلات جدی ای که روی بارگذاریِ سایت تأثیر دارد را به شما نمایش میدهد، البته دقت کنید بعد از رفع این مشکل با تست مجدد ممکن است مشکلات دیگری را نمایش دهد و مشکل قبلی را حل شده فرض کند پس اولیتهای جدیدتری را نمایش میدهد!
بخش Page Details
با توجه به تصویرِ این بخش در آپدیت جدید GTmetrix میتوانیم بفهمیم که اجزای تشکیل دهنده ی صفحه ای که تست گرفتیم چیست، چقدر از حجم صفحه را تشکیل داده است، چقدر درخواست ارسال میشود و سایز هر متغیر چه مقدار است.
Waterfall
برای اینکه به جزئیات عملکرد سایت خود بپردازید، این امکان در جی تی متریکس جدید برای شما فراهم شده است.
برای اینکار باید روی برگه سوم کلیک کرده و نمودار واترفال یا آبشار را بخوانید. نمودار Waterfall جی تی متریکس جدید با تقسیم کردن هر درخواست و اندازه گیری زمان، عملکرد بارگیری صفحه شما را توصیف میکند و شامل اسکریپت، پرونده رسانه یا منبع خارجی موجود در صفحه آزمایش شده است.
برای هر درخواست، شما زمان بارگیری خود را دارید، که توسط میله های افقی نشان داده میشود: هرچه نوار طولانی تر شود، بارگیری و اجرای درخواست کندتر میشود.
نمودار Waterfall آپدیت جدید GTmetrix شامل پنج ستون است. از چپ به راست شامل موارد زیر است:
- نام پرونده درخواستی
- وضعیت پاسخ HTTP برای آن منبع از سرور بازگشت
- جایی که منبع از آن میآید
- سایز پرونده برای هر منبع
- زمان لازم برای بارگیری یا اجرای هر منبع
اگر میخواهید جدول بالا برای شما در جی تی متریکس جدید نمایش داده شود کافیست فقط موس را روی هر کدام از خطوط عمودی در سمت راست ببرید.
میبینیم که زمان لازم برای بارگیری هر مورد با جزییات نشان داده شده است و میزان بلاکینک و DNS Lookup و… مشخص شده که واضح هستند. من دو اصطلاحی را که حدس میزنم ممکن است متوجه نشوید، توضیح میدهم.
DNS Lookup در جی تی متریکس جدید: زمانی که DNSها را روی دامنه تنظیم میکنیم، ارتباط بین هاست و دامنه برقرار میگردد. زمانی که کسی کلیک کند، یک اکشن به نام DNS Lookup ایجاد میشود.
زمانی که شما روی یک سایت کلیک میکنید، برخی سایتها ممکن است نتوانند IP شما را پیدا کنند و صفحه برای شما باز نشود. در این مواقع DNS Lookup سعی میکند با جستجو و رندرکردن، IP شما را پیدا کند و ابتدا از آی پیهای محلی شروع به گشتن میکند.
DOM loaded در جی تی متریکس جدید: زمانی که شما با خواندن نمودار Waterfall متوجه شدید که این قسمت از سایت شما زمان زیادی میبرد بدانید که برای JSهای سایت خود خوب بهینه سازی نکرده اید و DOMهای زیادی ایجاد شده است که باعث بارگذاریِ دیرتر سایت شما میشوند.
Video
با استفاده از این قسمت تحلیل جی تی متریکس جدید شما میتوانید یک فیلم از بارگذاری صفحه مورد نظر خود را ضبط و مشاهده کنید که در چه بخشهایی ممکن است مشکل رخ دهد.
در این ویدیو قسمتهای سایت شما به ترتیب بارگذاری میشوند. بنابراین، میتوانید ببینید که کدام عناصر صفحه برای بارگذاری به صورت ظاهری زمان بیشتری میگیرند تا نمایش داده شوند.
History
در این زبانه از جی تی متریکس جدید امکان مشاهده اطلاعات مربوط به عملکرد صفحه مورد نظر سایتتان در گذر زمان برای شما فراهم میشود.
در این قسمت سه نمودار مختلف وجود دارد که به ترتیب نشان دهنده عملکرد صفحه مورد نظر سایتتان از نظر معیارهای جی تی متریکس جدید، سایز صفحه و تعداد درخواستهای ارسالی و امتیاز صفحه میباشد.
گزینه های اضافی آپدیت جدید GTmetrix
گزینه های اضافی شامل توقف بارگذاری آزمایشی، امکان ارسال کوکی به همراه درخواست شما، استفاده از احراز هویت HTTP، امکان قرار دادن URL در لیست سفید و لیست سیاه، وضوح صفحه و نسبت پیکسل دستگاه و لغو نمایندگی کاربر است.
در آخر
به یاد داشته باشید که بیش از حد در مورد امتیازات وسواس قائل نشوید، بلکه به دنبال بهبود واقعی سرعت در سایت خود باشید.
اگر برای افزایش سرعت سایت خودتان به کمک نیاز دارید کامنت بگذارید و ما در اسرع وقت با بررسی سایت شما از طریق جی تی متریکس جدید راهکارهایی را جهت بهبودی به شما پیشنهاد کنیم. همچنین، اگر قسمتی از متن برای شما مبهم است در قسمت کامنت بپرسید، پاسخگوی شما هستیم.
منابع