در این مقاله از طراحی سایت اطلاعاتی رادر مورد زیر شاخه های page speed ارائه خواهیم کرد.
Specify image dimensions: باحذف نیازغیر ضروری به reflows و repaintsعرض و ارتفاع تصاویر را طوری تعیین می کند تا رندر سریعتر عمل کند.
Defer parsing of JavaScript: مرورگر باید همه ی محتویات <اسکریپت> تگ ها تجزیه کند که این بر زمان باراگذاری صفحه میافزاید. با به حداقل رساندن مقدار کد جاوا اسکریپت برای رندر صفحه و به تاخیر انداختن تجزیه جاوا اسکریپت های غیر ضروری تا زمانی که نیازی به اجرا آن ها نیست، می توان زمان بارگذاری اولیه صفحه را کاهش داد.
Optimize images:
کاهش زمان لود صفحه با بارگذاری تصاویری که اندازه مناسب دارند.
- · کاهش اندازه فایل تصویر بر اساس مکان و جایی که تصاویر درآن نمایش داده خواهد شد.
- · تغییر اندازه فایل های تصویری themeselves از طریق CSS.
- · بر اساس نوع کاربر تصاویر در فرمت مناسب ذخیره شوند.
Serve scaled images: می تواند بسیاری از بایت داده ی تصاویر را به طور صحیح ذخیره کنید.
Remove query strings from static resources: بیشتر پروکسی ها حتی مهمترین آن ها که Squid نسخه 3، منابعی که علامت "؟" در URL آن ها موجود است ا کش نمی کنند حتی اگر دستور Cash-Control تعریف شده باشد. برای راه اندازی کش پروکسی برای این منابع query string ها را در منابع استاتیک پاک کنید و در عوض آن ها پارامترها را با نام فایل آنها رمزگذاری کنید.
Serve resources from a consistent URL: برای جلوگیری از دانلود بایت تکراری و RTTs اضافی باید برای منایع از یک URL جداگانه استفاده کنید.
Specify a Vary : Accept-Encoding header: بعضی از اشکالات در پروکسی های عمومی ناشی از این است که پروکسی ها محتویات سایت را فشرده میکنند و به مرورگر کاربر که از نسخه ی فشرده شده پشتیبانی نمی کند می فرستد. تعریف Vary: Accept Encoding باعث می شود که پروگسی هر دو نسخه فشرده و غیر فشرده را ذخیره و پشتیبانی نماید.
Enable gzip compression: با کاهش حجم فایل هایی که از سرور شما منتقل می شود باعث افزایش سرعت مرورگر می شود.
Leverage browser caching: کاهش زمان بارگذاری صفحات با ذخیره سازی فیل ها از سایت شما در مرورگر کاربر بازدیدکننده. این امر باعث کاهش زمان بارگذاری برای تکرار بازدید می شود.
Minify HTML: فشرده سازی کد های HTML از جمله کد های جاوا اسکریپت و CSS موجود در آن باعث صرفه جویی در ارسال داده به شبکه و افزایش سرعت بارگذاری صفحات سایت می شود.
Minify JavaScript: فشرده سازی کد های جاوا اسکریپت باعث کاهش اندازه داده های اطلاعاتی و سرعت بخشیدن به بارگذاری سایت می شود.
Avoid bad requests: حذف لینک های شکسته و یا در خواست هایی که منجر به خطای 404/410 میشوند. همچنین از تولید درخواست های بیهوده خوداری کنید.
Avoid a character set in the meta tag: استفاده از character set در یک meta tag باعث توقف دانلود داده در مرورگر IE8 می شود. برای بهبود بخشیدن دانلود موازی منابع بهتر است از character set به قسمت HTTP در Response Header منتقل شود.
Avoid landing page redirects: تاییدیه برای صفحات فرود به تاخیر و افزایش زمان لود صفحه می افزاید در حالی که تاییدیه به طور خودکار اعمال می شود. هیچ یک از این اتفاق ها برای کاربر قایل رویت نمیباشد. در اکثر موارد می توان تاییدیه را بدون تغییر توابع عملکرد یک صفحه حذف کرد.
Enabele keep-Alive: با فعال سازی HTTP Keep-Alive ویا Connections HTTP Peresistentبه TCP اجازه اتصال برای ارسال و دریافت اطلاعات داده می شود تا درخواست های متعددHTTP را انجام دهد و بنابراین باعث کاهش تاخیر اجرای درخواست های بعدی میشود.
Inline small CSS: استفاده نکردن از CSS داخلی و ذخیره سازی همه ی کدهای CSS در یک فایل style.
Inline small JavaScript: ذخیره سازی فایل های کوچک جاوا اسکریپت در یک فایل.
Minify CSS:فشرده سازی کد های CSS باعث می شود ارسال و دریافت اطلاعات بر شبکه کاهش یابد و سرعت لود صفحه افزایش میابد.
Minimize redirects: به حداقل رساندن تغییر مسیر HTTP از یک آدرس به آدرس دیگری باعث کاهش RTTs اضافی و زمان انتظار می شود.
Minimize request size: کوچک نگهداشتن کوکی ها و در خواست ها تا حد امکان باعث میشود یک درخواست HTTP را بتوان در یک بسته اطلاعاتی ارسال کرد.
Optimize the order of styles and scripts: فشرده سازی کد CSS باعث کاهش حجم اطلاعات ارسالی بر روی شبکه میشود. از طرف دیگر این عمل نیز باث افزایش سرعت بارگذاری سایت می شود.
Put CSS inthe socument head: انتقال بلوک CSS داخلی و اجزای <link> از قسمت body به قسمت head چرا که یاعث افزایش سرعت عمل سایت خواهد شد.
Specify a cach validator: تمامی منابع باید آخرین اصلاح یا Etag هدر را داشته باشند. این امر به مرورگرها اجازه می دهد که از مزایای کامل کش بهره ببرند.
Specify a character set early:تنظیم مجموعه کاراکتر در سطح سرور پردازش مرورگر را کاهش می دهد.
Avoid CSS @import: بکارگیری دستور CSS@import در یک style sheet بیرونی می تواند تاخیرهای اضافی در حین بارگذاری صفحات سایت بوجود اورد.
Combine image using CSS sprites: تعیین کردن عرض و ارتفاع برای تمامی تصاویر باعث اجرای سریعتر سایت می شود زیرا در این حالت نیازی به تغییر سایز تصاویر توسط مرورگر نیست.
Prefer asynchronous resources: جذب منابع asynchronously مانع از مسدود کردن بارگذاری صفحه می شود.