آموزشیوب

معرفی سایت Page Speed Insights – تست سرعت سایت

Page Speed Insights ابزار گوگل برای تست سرعت بارگزاری وب‌سایت‌ها می‌باشد و عملکرد وب سایت را در صفحه تلفن همراه و صفحه دسکتاپ کامپیوتر اندازه گیری و ارزیابی می‌کند.

شایان ذکر است که در SEO یکی از موراد مهم سرعت بارگزاری وب‌سایت می‌باشد و مدیران سایت باید دقت لازم را به این موضوع داشته باشند

معرفی سایت Page Speed Insights تست سرعت سایت

وب سایت Gtmetrix از سالهاست که خدمات امتیاز دهی و بررسی سرعت بارگزاری وب‌سایت را ارائه می‌کند و دو شاخص PageSpeed برای گوگل و YSlow برای یاهو نمایش می‌دهم ، همچنین زمان لود سایت و نمودار آبشاری (Waterfall) از بارگزاری سایت را می‌توانید ببنید

معرفی سایت Page Speed Insights تست سرعت سایت

سعی کنید در بهینه‌سازی وب‌سایت هر دو موضوع سرعت لود و کاربردپسند بودن را در نظر بگیرد و وسواس زیادی در گرفتن نمره‌های ۱۰۰ نداشته باشد زیرا نحوه نمایش و تعامل کاربر با سایت هم مهم است و کمالگرایی در این مورد شاید باعث حذف مورادی شود که بودنش در سایت‌ شما بهتر از کم شدن امتیاز شما و چند میلی ثانیه زودتر بارگزاری شدن باشد

شما با ابزار Page Speed Insights بطور مستقیم با شاخص‌های PageSpeed  گوگل وب‌سایت را برسی می‌کنید

از انجایی که تقریبا نیمی از بازدید‌ها از تلفن همراه صورت می‌گیرد و به احتمال زیاد خود گوگل که مرجع جستجو و ورودی کاربران به سایت می‌باشد نیز از همین ابزار جهت رتبه بندی استفاده می‌کند، بررسی و استفاده از این ابزار بسیار عالی می‌باشد

این ابزار وب‌سایت شما را بررسی و نمره عمکلردی در سه رنج قرمز (۰ تا ۴۹) نارنجی (۵۰ تا ۸۹) و سبز (۹۰ تا ۱۰۰) بصورت جداگانه برای تلفن همراه و دیسکتاپ نمایش می‌دهد

همچنین مشکلات را نمایش و پیشنهاد‌های جهت رفع و بهبود به شما ارائه می‌کند

برخی از مشکلات مربوط به سرور و سرعت دسترسی‌ هاست شما می‌باشد و برخی دیگر در طراحی قالب و افزونه‌ها و تنظیمات شما می‌باشد.

این ابزار در لیست ابزار‌های تحریم شده برای ایران است، برای استفاده از روش‌های رفع تحریم استفاده کنید

نمونه گزارش این ابزار برای بخش تلفن همراه قبل از بهینه سازی: 

معرفی سایت Page Speed Insights تست سرعت سایت

نمونه گزارش برای بخش دیسکتاپ قبل از بهینه سازی:

معرفی سایت Page Speed Insights تست سرعت سایت

نمونه توضیحات در مورد رفع مشکل:

معرفی سایت Page Speed Insights تست سرعت سایت

 

برای مثال برخی از مشکلات و راه‌های رفع آنها در وردپرس :

برای هر کدام از موارد بهینه سازی لازم به تهیه مطالب جدا و مفصلی می‌باشد من در اینجا سعی کردم راهنمای سریع و راه حل رفع مشکل را یادآوری کنم
  • تصاویر با حجم بالا : بدیهیست یکی از دلایل زیاد شدن زمان لود سایت تصاویر با حجم نامناسب می‌باشد جهت رفع این مشکل می‌توانید با افزونه‌های کاهش حجم مانند (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)

چرا میلی ثانیه‌ها مهم است؟

همانطور که می‌بینید هر بهبودی که ما میدهید در هر میلی ثانیه تاثیر دارد، اهمین این زمان‌ها با میزان درخوسات از سرور برمیگردد هر چقدر درخواست کمتری از مرورگر و وب‌سایت به هاست برای لود انجام شود زمان کمتری برای لودشدن نیاز است، و تجمیع این میلی ثانیه‌ها در نهایت باعث کم شدن زمان کلی لود در حد ثانیه می‌باشد و کاربران زمانهای کمتر از ۵ تا ۴ را دوست دارند

نمونه گزارش عملکرد در دیسکتاپ بعد از اعمال بهینه سازی‌ها:

معرفی سایت Page Speed Insights تست سرعت سایت

نمونه گزارش عملکرد در تلفن همراه بعد از اعمال بهینه سازی‌ها:

معرفی سایت Page Speed Insights تست سرعت سایت

 

این ابزار معیار‌های مشخصی در مورد سرعت و زمان بارگزاری بر اساس اول بیکار شدن CPU اولین نقطه لود ، بیشترین زمان تاخیر ورودی و… را نمایش می‌دهد

معرفی سایت Page Speed Insights تست سرعت سایت

 

 

افزونه Google Pagespeed Insights

این ابزار را در وردپرس سایت شما نصب می‌کند و با تنظیمات آن می‌توانید گزارش امتیاز و عملکرد کاملی از کلیه صفحات و مطالبتان را ببنید، برای استفاده از این افزونه نیاز است API گوگل ایجاد کنید

معرفی سایت Page Speed Insights تست سرعت سایت معرفی سایت Page Speed Insights تست سرعت سایت

 

امیدوارم مفید باشه موفق و خندان باشین

 

 

امیر فدائیان

عاشق تکنولوژی هستم،مشغول برنامه نویسی و همچنین پشتیبانی و نصب سیستم های نظارتی و حفاظتی هست، در اين وبلاگ علاوه بر اينكه دفترچه ياداشتي براي خودم هست ،تجربیات و دانسته‌هام در حوزه نرم‌افزار ،اينترنت ،تلفن همراه و ... را منتشر ميكنم. Programming languages: Delphi, Kotlin, Python, SQL Server

نوشته های مشابه

‫6 دیدگاه ها

    1. سلام
      بله سرور داخل ایران باعث میشه تست‌های خارج از ایران سرعتش پایین بیاد
      شما باید کاربر نهایی رو در نظر بگیرین که داخل هست یا خراج از کشور
      مهم تجربه کاربر نهایی هست نه این امتیازات

  1. سلام مرسی از مقاله خوبتون
    چرا امتیاز جی تی متریک با پیج اسپید اینقدر تفاوت داره؟! جی تی متریکسم راحت نزدیک 100 میشه اما پیج اسپید خیلی سختگیره. چه کار هایی رو مخصوص پیج اسپید باید انجام داد؟
    تشکر

    1. سلام
      مسعود جان زیر هر خطای که میگیره علت و پیشنهاد بهبود رو خودش میده
      منم تا جای که می‌تونستم راهکارهای رو در این مقاله نوشتم
      موفق باشین

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا