در مقاله “تحلیل نتیجه آنالیز سایت جی تی متریکس (۱)” مقدمه بر آشنایی با جی تی متریکس و نحوه عملکرد آن ارائه شد. در این مقاله قصد داریم که یکی از آیتم های اصلی این سایت با عنوان “PageSpeed” را مورد بررسی قرار دهیم.

 

عملکرد pagespeed :

Page speed دارای مقیاس های گوگل برای سنجش سرعت صفحات یک وب سایت است که بر اساس آن رتبه ای برای یک سایت در نظر میگیرد. آیتم های مختلف pagespeed در زیر تشریح شده اند:

• Optimize Images

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

• Defer parsing of JavaScript

برای لود شدن یک صفحه، مرورگر باید تمام متن ها و تگ های <script> را تجزیه و بررسی کند، که همین امر موجب افزایش زمان بارگذاری یک صفحه از سایت می شود. با استفاده از این بخش می توانید به راحتی این فایل ها را کوچک (minimize) کنید.

• Leverage browser caching

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

• Minify JavaScript

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

• Minify HTML

در این بخش می‌توانید با استفاده از فایل‌های فشرده‌شده‌ی HTML که شامل کدهای inline JavaScript و CSS هستند، کمک زیادی به سرعت بارگذاری صفحات سایت خود داشته باشید.

• Specify image dimenisons

مشخص کردن طول و عرض برای همه‌ی تصاویر موجب رندر شدن سریع‌تر (faster rendering) می‌شود. در حقیقت با استفاده از مشخص کردن ابعاد تصاویر در کدهای css می‌توانید از پیغام های پیشنهادی (recommendation) این بخش جلوگیری کنید

• Specify a character set early

این بخش مربوط به تنظیمات کاراکترها در HTTP header و شناسایی آن ها می‌باشد. تنظیمات کاراکترها در سرورها باعث کاهش پردازش مرورگرها می‌شود. در این بخش، تنظیمات کاراکتر برای همه‌ی صفحات سایت‌تان در سرور تعریف خواهد شد، از تنظیمات تگ‌های meta http-equiv جلوگیری می‌شود و در نهایت باعث کاهش زمان بارگذاری صفحه می‌شود.

• Remove query strings from static resources

بسیاری از پراکسی ها (proxies) مخصوصا مواردی که از نوع ورژن ۳ هستند، حتی در زمانی که به صورت علامت سوال (؟) در URL هستند، کش نمی‌کنند. برای فعال سازی کش پراکسی برای این گونه منابع، رشته های کوئری را از منابع مرجع به منابع استاتیک حذف کنید و به جای آن پارامترها را به نام فایل خود encode کنید.

• Avoid bad requests

در این بخش می‌توانید لینک های شکسته (broken links) و یا خطاهای ۴۰۴ و یا ۴۱۰ را شناسایی کنید و از اتلاف وقت و درخواست های اضافی جلوگیری کنید.

• Avoid landing page redirects

ریدایرکت به landing pages موجب تاخیر در بارگذاری صفحه می‌شود. در بسیاری از بخش‌ها ریدایرکت‌ها می‌توانند بدون اینکه تغییری در توابع آن صفحه داشته باشند، حذف شوند.

• Enable Gzip compression

عال کردن حفظ اتصالات HTTP یا اتصالات با دوام HTTP به اتصالات یکسان TCP به فرستادن و دریافت درخواست های متعدد HTTP اجازه می‌دهد. بنابراین، برای درخواست‌های بعدی زمان تاخیر کاهش می‌یابد

• Enable keep-Alive

فعال کردن حفظ اتصالات HTTP یا اتصالات با دوام HTTP به اتصالات یکسان TCP به فرستادن و دریافت درخواست های متعدد HTTP اجازه می‌دهد. بنابراین، برای درخواست‌های بعدی زمان تاخیر کاهش می‌یابد.

• Inline small CSS

یک جایگزین خوب برای CSS درون خطی (Inline CSS) ، ترکیب فایل‌های CSS خارجی (external CSS) است.

• Inline small JavaScript

یک جایگزین خوب برای جاوا اسکریپت درون خطی (inline JavaScript) ترکیب فایل های جاوا اسکریپت خارجی (external JavaScript) است.

• Minify CSS

فشرده سازی فایل های css به ذخیره‌ی تعداد بسیاری از بایت ها و افزایش سرعت دانلود و زمان اجرا کمک می‌کند. از این بخش برای جایگزینی فایل های فشرده‌ی css با فایل‌های قبلی css سایت استفاده می‌شود. این مورد در PageSpeed بسیار مهم است.

• Minimize redirects

این بخش کمک می‌کند تا ریدایرکت‌های HTTP را از یک URL به URL دیگری برای کاهش RTTs اضافی انتقال داده و زمان صرف شده را برای کاربران سایت به حداقل برسانید.

• Minimize request size

نگه داشتن کوکی‌ها و درخواست عنوان کوچکی(Header) که امکان پذیر است، می‌تواند درخواست HTTP که متناسب با یک بسته واحد است، را تضمین کند. در حالت ایده آل، یک درخواست HTTP نباید فراتر از ۱ بسته برود لذا به این مورد در PageSpeed دقت نمایید.

• Optimize the order of styles and scripts

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

• Put CSS in the document head

حرکت بلوک های درون خطی استایل و متغیرهای (link) از بخش body که بخش head برای اجرای عملکرد آن را بهبود می‌بخشد.

• Serve resources from a consistent URL

این بخش برای استفاده و به کارگیری منابع URL منحصر به فرد، از بین بردن بایت های دانلودهای تکراری و RTTs اضافی بسیار مهم است.

• Serve scaled images

به کارگیری و استفاده از اندازه مناسب تصاویر می‌تواند بایت بسیاری از داده‌ها را ذخیره کند و باعث بهبود عملکرد صفحه وب، به ویژه آن دسته از دستگاه های کم قدرت مثل (موبایل) شود.

• Specify a cache validatorn

همه‌ی منابع استاتیک باید آخرین تغییرات داشته باشند، که این امر به مرورگرها اجازه ی دسترسی کامل به cache را می‌دهد.

• Combine images using CSS sprites

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

• Avoid CSS @import

استفاده از CSS@import در CSS خارجی می تواند تاخیر در حین زمان بارگذاری یک صفحه را افزایش دهد و رتبه PageSpeed شما را بهبود ببخشد.

• Prefer asynchronous resources

بارگذاری کردن منابع ناهمگام (غیر همزمان) مانع از مسدود شدن بارگذاری صفحه می‌شود.

• Avoid a character set in the meta tag

این بخش، تنظیمات کاراکتر مشخص شده در متا تگ را نشان می‌دهد. مشخص شدن تنظیمات کاراکتر در متاتگ، پیش بینی دانلود در IE8 را غیر فعال می‌کند. برای بهبود دانلود برابر منابع، حرکت تنظیمات کاراکتر به تنظیمات محتوای HTTP یک نوعی از پاسخگویی Header است.

• Specify a Vary Accept-Encoding header

خطاها (Bugs) در بعضی پراکسی‌های عمومی ممکن است به نسخه های فشرده ای از منابع خود به خدمت کاربرانی که فشرده سازی را پشتیبانی نمی‌کنند، منجر شود.