آنالیز سرعت سایت توسط Google PageSpeed Insights

آنالیز سرعت سایت توسط Google PageSpeed Insights

Faster Sites: Beyond PageSpeed Insights

سریع‌سازی وب سایت‌ها توسط ابزار Google PageSpeed Insights

 

آنالیز سرعت لود وب سایت توسط سرویس گوگل PageSpeed Insights

 

معرفی سرویس PageSpeed Insights شرکت گوگل:

سرویس PageSpeed Insights شرکت گوگل ابزاریست که استفاده از آن آسان می باشد که بررسی می کند که آیا سرعت یک صفحه وب کندتر از حد قابل قبول است یا خیر. به هر صفحه وب یک امتیاز ارائه می کند که بیانگر کارایی آن صفحه می باشد. بدلیل اینکه امتیاز ارائه شده توسط گوگل واقعی و دقیق می باشد، می تواند بعنوان یک معیار مناسب برای اندازه‌گیری کارایی صفحات وب سایت بکار رود. درست مانند PageRank که مدتی پیش از اهمیت بالایی برخوردار بود، امتیازی که سرویس Pagespeed Insights ارائه می کند نیز این روزها اهمیت زیادی دارد. گوگل دستورالعملی ارائه کرده است که با مطالعه و اجرای آن می توانید به امتیاز ۱۰۰/۱۰۰ برسید.

سریع‌سازی وب‌سایت‌های وردپرسی:

برای وب سایت های کوچکی که بر پایه سیستم های مدیریت محتوا (CMS) مانند وردپرس (WordPress) پیاده سازی می شوند، استفاده از ابزار Google PageSpeed Insights بعنوان نقطه شروع سریع سازی سایت می تواند مفید باشد. سه نکته اساسی زیر را در نظر بگیرید:

  • تاخیر (Latency) می تواند بیشتر از پهنای باند (Band Width) به زمان لود (Load Time) صدمه بزند.
  • PageSpeed Insights scores shouldn’t be taken at face value
  • بهبود در سرعت سایت با اندازه‌گیری (Measurement)، تنظیم هدف (Goal Setting) و اولویت‌بندی (Prioritization) شروع می شود.

 

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

با نگاه اول به سرویس Pagespeed Insights گوگل متوجه خواهیم شد که بیشتر تمرکز آن روی "ارائه تعداد بایت کمتر به کاربر" می باشد. توسط "فشرده‌سازی، کوچک کردن و بهینه سازی" (Compress, Minify, Optimize) . دقت کنید که سایز نصف داستان است، نصف دیگر مربوط به زمان دسترسی به سرور و همچنین مدت زمانی که طول میکشد تا سرور به درخواست پاسخ دهد (Server Response Time).

 

وقتی شما یک درخواست به سرور ارسال می کنید چه اتفاقی می افتد؟

هنگامی که یک کاربر آدرس وب سایت موردنظر خود را در نوار آدرس مرورگر تایپ می کند، درخواست ایجاد می شود. وقتی این درخواست شکل می گیرد، چیزهای زیادی انجام می شود. یکی از آخرین کارها اینست که محتوای درخواستی کاربر انتقال داده می شود. تنها چیزی که توسط پهنای باند و سایز منابع و فایل ها مورد تاثیر قرار می گیرد همین انتقال محتوای درخواستی کاربر است.

 

مراحل اجرای یک درخواست از سرور:

  • پیدا کردن سرور (Find Server)
  • اتصال به سرور (Connect to Server)
  • انتظار برای یک پاسخ (Wait for a Response)
  • دریافت پاسخ (Receive Response)

 

هر کدام از مراحل فوق به صرف زمان نیاز دارند. نه فقط آخرین مرحله! سه مرحله اول یعنی یافتن سرور، اتصال به سرور و انتظار پاسخ مستقل از سایز فایل های سایت می باشند (Independent of file size) بعنوان مثال در سه مرحله اول، مهم نیست تصویر یا فایل css یک فایل حجیم باشد یا minify شده. زمانی که برای انجام این ۳ مرحله صرف می شود فارغ از سایز فایل ها می باشد.

 

چرا دریافت پاسخ از سرور زمانبر است؟

حقیقت اینست که زمان دسترسی به سرور و اتصال به آن از زمان لازم برای انتقال دیتای موردنیاز کاربر بیشتر می باشد. بعنوان مثال، فرض کنید مدت ۴۰ میلی‌ثانیه طول میکشد تا دیتا از پاریس به نیویورک منتقل شود. زمان دسترسی به سرور حداقل دوبرابر این زمان می باشد یعنی ۸۰ میلی‌ثانیه. به همین دلیل است که CDN ها مورد استفاده قرار می گیرند. CDN ها سروری را که از لحاظ فیزیکی به کاربر نزدیک می باشد را انتخاب می کنند. و این تنها راه کاهش زمان دسترسی به سرور و اتصال به آن می باشد.

 

چقدر اهمیت دارد؟

نمودار زیر را در نظر بگیرید:

چرخه حیات یک درخواست

منبع: Chrome’s DevTools

 

نمودار بالا بیانگر "چرخه حیات یک درخواست" می باشد.

تمام مقادیر داخل باکس قرمزرنگ، بیانگر تاخیر یا همان Latency می باشد. این پروسه ها در مجموع حدود ۲۲۰ میلی‌ثانیه طول می کشد. زمان واقعی موردنیاز برای انتقال محتوا (Content Transfer) برابر ۰٫۷ میلی‌ثانیه می باشد. یعنی کمتر از یک میلی‌ثانیه. برای کاهش این زمان، فشرده سازی فایل ها و کم کردن تعداد آنها نمی تواند موثر باشد. تنها راه کاهش زمان پردازش درخواست، کم کردن تاخیر یا Latency می باشد.

 

آیا برای لود یک صفحه وب، نیاز است تعداد زیادی درخواست ایجاد کنیم؟

برای لود هر یک از فایل های css و js و یا font، نیاز است پروسه یافتن سرور، اتصال به آن و دریافت پاسخ انجام شود. خوشبختانه عملیات یافتن سرور (که در تصویر بالا با نام DNS Lookup مشخص است) نیاز است فقط یکبار انجام شود و سایر دفعات، این اتصال برقرار است.

 

تست های ابزار pagespeed Insights:

تمام ارزیابی هایی که سرویس Page Speed Insights گوگل انجام می دهد، مواردی هستند که بر روی سرعت سایت موثر می باشند. برای وب سایت های بزرگ، پیاده سازی برخی از این موارد مشکل می باشد و با توجه به نوع طراحی وب سایت، ممکن است تاثیر برخی از این فاکتورها روی سرعت سایت، نسبت به سایر آنها بیشتر باشد.

 

مواردی که بر کاهش استفاده از پهنای باند (Band Width) تمرکز دارند:

عنوان

شرح

بهینه‌سازی تصاویر

این فاکتور بررسی می کند که آیا تصاویر موجود در صفحات وب سایت، قابلیت فشرده‌سازی بیشتری دارند یا خیر. این قضیه در مورد تصاویر با حجم بالا بیشتر موثر است.

فعالسازی فشرده‌سازی

فشرده‌سازی راحت است. حتما انجام دهید. این مورد در فایل های حجیم (مثلا جاوااسکریپت) بیشتر مشخص می شود.

کوچک‌سازی HTML

با minify کردن فایل های HTML باعث می شوید تا ده ها کیلوبایت از سربار (Overhead) سرور کاهش یابد. تاخیر تاثیر بیشتری خواهد داشت نسبت به زمان پاسخ (Response Time)

کوچک‌سازی CSS

با minify کردن فایل های CSS باعث می شوید تا ده ها کیلوبایت از سربار (Overhead) سرور کاهش یابد. تاخیر تاثیر بیشتری خواهد داشت نسبت به زمان پاسخ (Response Time)

کوچک‌سازی JS

Minify کردن فایل های js مهم است اما نه به اندازه یکپارچه کردن فایل های js . بدین معنی که ادغام تمام فایل های js در یک فایل می تواند تعداد درخواست ها را به سمت سرور کاهش دهد و اهمیت آن بیشتر از minify کردن فایل های js می باشد.

 

 

مواردی که بر کاهش تاخیر-Latency تمرکز دارند:

عنوان

شرح

Leverage browser caching

حتما فایل های خود را کش cache کنید. بسیاری از فایل هایی که می توانند از cache بهره ببرند، احتمالا بر روی سرورهای ۳rd-party میزبانی می شوند.

کاهش زمان پاسخ سرور

Threshold on PSI is too high. It also tries to exclude the physical latency of the server—instead looking only at how long it takes the server to respond once it receives a request.

جلوگیری از ریدایرکت صفحات فرود

Avoid landing pages redirects

بله!

Eliminate render-blocking JavaScript and CSS in above-the-fold content

A valid concern, but can be frustratingly difficult. Having zero requests on top of the initial page load to render above-the-fold content isn’t necessary to meet most performance goals.

Prioritize visible content

Actually kind of important.

 

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

عوامل موثر در بهبود کارایی یک سایت:

موارد زیر نیز در بهبود کارایی یک سایت موثر می باشند. برخی از این موارد، در سرویس Google Pagespeed Insights در نظر گرفته شده اند و برخی دیگر خیر:

  • محتوای تحت کنترل خود را کش cache کنید.
  • تعداد محتواها و فایل هایی را که از سایر دامین ها لود می شوند را کاهش دهید.
  • کاهش زمان پاسخ سرور با توجه به جداول فوق.
  • با استفاده از CDN ها، از سرورهای نزدیک به کاربران استفاده کنید.
  • کاهش درخواست های بلاک شده.

 

چگونگی شروع بهبود کارایی سایت:

 

اندازه گیری (Measurement):

تصویر اسکرین شاتی که در این مقاله مشاهده کردید توسط ابزار DevTools مرورگر کروم گرفته شده است. با استفاده از این ابزار می توانید کاملا متوجه شوید که چه پروسه هایی بهنگام لود یک صفحه از وب سایت رخ می دهد. علاوه بر اعتماد به ابزار Pagespeed Insights می توانید از ابزار DevTools بهره ببرید. با این روش می توانید متوجه شوید که هنگام لود وب سایت تان، کدامیک از درخواست ها به سرور بیشتر طول می کشند.
 

تنظیمات هدف (Goal Setting):

اگر کسب امتیاز بالا در Google Page Speed Insights هدف نهایی شما نیست، باید بدانید که هدف شما چیست. دانستن هدف مهم است زیرا به شما این امکان را می دهد که شرایط فعلی سایت خود را با هدف موردنظرتان مقایسه کنید. می توانید بفهمید که آیا با کاهش استفاده از پهنای باند (ترفندهای آن قبلا ذکر شده است) می توانید به هدف تان نزدیک شوید و یا با کاهش تاخیر (Latency) توسط روش هایی نظیر: استفاده از CDN، کاهش تعداد درخواست ها و لود محتوای با اولویت بالاتر و…

 

اولویت بندی (Prioritizing):

Prioritizing page speed “fixes” is important — that’s not the only type of prioritization. There’s also the question of what actually needs to be loaded. PageSpeed Insights does try to figure out whether you’re prioritizing above-the-fold content. This is a great target. It’s also not a perfect assessment; it might be easier to split content into “critical” and “non-critical” paths, regardless of what is ostensibly above the fold.

برای مثال: اگر درآمد سایت شما بر اساس تبلیغات می باشد، احتمالا بهتر است ابتدا تمام محتوای سایت خود را لود کنید سپس تبلیغات را نمایش دهید. دانستن این که چگونه درخواست های کمتری به سمت سرور ارسال کنیم، موضوعی است که شما و تیم وب سایت تان باید به آن برسید.

 

نتیجه گیری (Conclusion):

تا کنون با مطالعه این مقاله متوجه شده ایم که با وجود اینکه استفاده از ابزار PageSpeed Insights گوگل می تواند در بهبود کارایی و سرعت یک وب سایت موثر باشد، اما روش های هوشمندانه تری وجود دارند که می توان سرعت سایت را تقویت کرد. در واقع، داشتن یک امتیاز بالا در Google Page Speed Insights نمی تواند تضمین کننده یک سایت سریع باشد.

برای مطالعه بیشتر در زمینه بهبود سرعت لود وب سایت، به مقالات سایت آقای Grigorik مراجعه شود و یا کتاب الکترونیکی (فرمت pdf) ایشان را دانلود کنید.

 

منبع: https://moz.com/blog/faster-sites-beyond-pagespeed-insights


برچسب‌ها:

Google PageSpeed Insightsآنالیز سرعت سایتابزار pagespeed insightsاتصال به سرورافزایش سرعت لودبهبود کارایی سایتپهنای باندپیدا کردن سروردریافت پاسخسرعت لود وب سایتسرویس pagespeedسریع‌سازی وب سایت‌

2 دیدگاه برای “آنالیز سرعت سایت توسط Google PageSpeed Insights”

  1. مرادی گفت:

    سلام خیلی کامل بود ممنون

    1. Mohtava-Admin گفت:

      درود بر شما

      ممنون از اظهار لطفتون

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

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

نه + 18 =