Page Speed Insights ابزار گوگل برای تست سرعت بارگزاری وب‌سایت‌ها می‌باشد و عملکرد وب سایت را در صفحه تلفن همراه و صفحه دسکتاپ کامپیوتر اندازه گیری و ارزیابی میکند.
شایان ذکر است که در SEO یکی از موراد مهم سرعت بارگزاری وب‌سایت می‌باشد و مدیران سایت باید دقت لازم را به این موضوع داشته باشند
وب سایت Gtmetrix از سالهاست که خدمات امتیاز دهی و بررسی سرعت بارگزاری وب‌سایت را ارائه میکند و دو شاخص PageSpeed برای گوگل و YSlow برای یاهو نمایش می‌دهم ، همچنین زمان لود سایت و نمودار آبشاری (Waterfall) از بارگزاری سایت را می‌توانید ببنید
شما با ابزار Page Speed Insights بطور مستقیم با شاخص‌های PageSpeed گوگل وب‌سایت را برسی می‌کنید
از انجایی که تقریبا نیمی از بازدید‌ها از تلفن همراه صورت می‌گیرد و به احتمال زیاد خود گوگل که مرجع جستجو و ورودی کاربران به سایت می‌باشد نیز از همین ابزار جهت رتبه بندی استفاده میکند، بررسی و استفاده از این ابزار بسیار عالی می‌باشد
این ابزار وب‌سایت شما را بررسی و نمره عمکلردی در سه رنج قرمز (۰ تا ۴۹) نارنجی (۵۰ تا ۸۹) و سبز (۹۰ تا ۱۰۰) بصورت جداگانه برای تلفن همراه و دیسکتاپ نمایش می‌دهد
همچنین مشکلات را نمایش و پیشنهاد‌های جهت رفع و بهبود به شما ارائه میکند
برخی از مشکلات مربوط به سرور و سرعت دسترسی هاست شما می‌باشد و برخی دیگر در طراحی قالب و افزونه‌ها و تنظیمات شما می‌باشد.
این ابزار در لیست ابزار‌های تحریم شده برای ایران است، برای استفاده از روش‌های رفع تحریم استفاده کنیدنمونه گزارش این ابزار برای بخش تلفن همراه قبل از بهینه سازی:
نمونه گزارش برای بخش دیسکتاپ قبل از بهینه سازی:
نمونه توضیحات در مورد رفع مشکل:
برای مثال برخی از مشکلات و راه‌های رفع آنها در وردپرس :
برای هر کدام از موارد بهینه سازی لازم به تهیه مطالب جدا و مفصلی می‌باشد من در اینجا سعی کردم راهنمای سریع و راه حل رفع مشکل را یادآوری کنم- تصاویر با حجم بالا : بدیهیست یکی از دلایل زیاد شدن زمان لود سایت تصاویر با حجم نامناسب می‌باشد جهت رفع این مشکل می‌توانید با افزونه‌های کاهش حجم مانند (reSmush.it یا WP Smush Image) عملیلت بهینه سازی را انجام دهید و یا بصورت دستی تمامی تصاویر سایت را بهینه کنید.
- حجم فایل های جاوا اسکریپت و CSS :یکی در اگر دلایل زیاد شدن زمان لود حجم فایل‌های javascript و CSS می‌باشد که دارای ساختار غیر منسجم یا غیر ضروری و یا با فاصله های غیر ضروروی و یادداشت ها در این نوع فایل‌ها می‌باشد ، شما می‌توانید از افزونه‌های مناسب این کار برای مثال (Autoptimize) یا بصورت دستی اقدام به بهینه سازی نمائید
- کش: یکی از عواملی که باعث افزایش سرعت بارگزاری سایت می‌شود فعال بودن کش در هاست و کش در مرورگر کاربر می‌باشد که این کار را می‌توانید در ورودپرس با افزونه‌های مانند (Autoptimize یا W3 Total Cache یا WP Rocket) انجام دهید.
- GZIP و فشرده سازی صفحات : یکی دیگر از عوامل افزایش سرعت فشرده سازی صفحات وب‌سایت با قابلیت GZIP می‌باشد پشنهاد میکنم برای این کار با کارشناسان هاست خود در ارتباط باشید و گزینه‌های مربوط را در افزونه‌های کش را فعال کنید.
- منابع render-blocking از نیمه بالایی صفحه: این ابزار پشنهاد میکند جهت لود بهتر صفحات کلیه کدهای جاوا اسکریپت از header و body به footer انقال یابد تا لود شدن مواردی که باعث تاخیر می‌شود در انتهای بارگزاری شود، برای این کار نیز می‌توانید از افزونه‌های مانند Autopmize و یا تغییرات دستی در فایل‌های پوسته خود انجام دهید.
- استفاده از font-display : یکی از استاندارد‌های جدید CSS جهت لود فونت صفحات اضافه کردن کد font-display به این فایل‌ها است که فعلا در فایرفاکس و کروم پشتیبانی می‌شود برای این کار نیاز به ویرایش دستی فایل‌های پوشته وردپرس دارید، این کد تصمیم گیری دررابطه نوع لود فونت را به مرورگر تعیین میکند برای مثال (font-display: auto; برای تعیین خودکار توسط مرورگر – font-display: block; انتظار ۳ ثانیه برای لود فونت در غیر این صورت نمایش فونت جایگزین – font-display: swap; انتضار ۳ ثانیه برای لود در غیر این صورت نمایش فونت جایگزین و نمایش فونت هر وقت لود شود – font-display: optional; کمترین اهمیت فونت شاید اصلا لود نشود)
- کاهش DOM elements: یکی از موارد مهم کاهش موراد لود شونده در صفحات است که به میزان مناسب کاهش یابد طبیعیست که اگر از المان‌های زیادیدر صفحه استفاده کنیم سرعت لود کاهش می‌یابد بنابراین کلیه موارد اضافه مانند ابزارک‌ها و تصاویر و … که نیازی به آنها ندارید را حذف کنید.
- استفاده از لود تنبل تصاویر lazy load: این ابزار پیشنهاد میکند از لود تنبل استفاده کنید، این قابلیت باعث می‌شود تا کاربر بر روی تصویر اسکرول نکرده باشد تصاویر را لود نشود.
- استفاده از AMP :فریم ورک AMP یا همان Accelerated Moblie Pages زیر نظر گوگل در حال توسعه است و باعث افزایش سرعت لود شدن صفحات در موبایل می‌باشد، این ابزار باعث ساده شدن HTML می‌شود، برای استفاده از این قابلیت در وردپرس می‌توانید افزونه AMP یا AMP for WP را نصب کنید.
- استفاده از فرمت WebP: این فرمت که توسط گوگل معرفی شده نسل جدید فرمت تصاویر می‌باشد که بدون کاهش کیفیت حجم تصاویر کاهش و سرعت لود بالاتر می‌رود،متاسفانه در حال حاضر همه مرورگرها از WebP پشتیبانی نمی کنند- برای استفاده از ویژگی می‌توانید از CDN های استفاده کنید که بطور خودکار این تبدیل را انجام میدهند البته افزونه webp-express هم موجود است (آدرس github افزونه) و افزونه‌های دیگر هم رایگان نیستند ( آموزش webp express)
چرا میلی ثانیه‌ها مهم است؟
همانطور که می‌بینید هر بهبودی که ما میدهید در هر میلی ثانیه تاثیر دارد، اهمین این زمان‌ها با میزان درخوسات از سرور برمیگردد هر چقدر درخواست کمتری از مرورگر و وب‌سایت به هاست برای لود انجام شود زمان کمتری برای لودشدن نیاز است، و تجمیع این میلی ثانیه‌ها در نهایت باعث کم شدن زمان کلی لود در حد ثانیه می‌باشد و کاربران زمانهای کمتر از ۵ تا ۴ را دوست دارند
نمونه گزارش عملکرد در دیسکتاپ بعد از اعمال بهینه سازی‌ها:
نمونه گزارش عملکرد در تلفن همراه بعد از اعمال بهینه سازی‌ها:
این ابزار معیار‌های مشخصی در مورد سرعت و زمان بارگزاری بر اساس اول بیکار شدن CPU اولین نقطه لود ، بیشترین زمان تاخیر ورودی و… را نمایش می‌دهد
افزونه Google Pagespeed Insights
این ابزار را در وردپرس سایت شما نصب میکند و با تنظیمات آن می‌توانید گزارش امتیاز و عملکرد کاملی از کلیه صفحات و مطالبتان را ببنید، برای استفاده از این افزونه نیاز است API گوگل ایجاد کنید
امیدوارم مفید باشه موفق و خندان باشین