ابزار pagespeed insights

سلام به مهراکت خوش آمدید . با هم در این مقاله درباره ابزار pagespeed insights میخوانیم. با ما همراه باشید.

 

معرفی ابزار page speed insights

ابزارPageSpeed Insightsگوگل، ابزاری بسیار ساده ای برای آزمایش و بررسی سایت هایی است
که ممکن است از حد معمول خود کند تر باشند. این ابزار برای ارزیابی عملکرد صفحه ی شما
امتیاز های واقعی را به شما عرضه می کند. امتیاز PageSpeed Insights معمولا به عنوان معیاری برای
سنجش سرعت سایت استفاده می شود. درست مانند PageRank که در چند سال گذشته مورد استفاده قرار داشت.

برای سایت هایی که از CMS های رایجی مانند وردپرس استفاده می کنند به سادگی می توانید
به نتایج بهتری دست پیدا کنید و این کار به سادگی قابل انجام است.
برای بیشتر سایت های تنها هدف دستیابی به امتیاز های بهتر و واقع گرایانه نیست، پس از کجا شروع کنیم؟

در این مقاله ما می خواهیم به به سه نکته اصلی بپردازیم:
. تاخیر(Latency) در بار گذاری بیشتر از پهنای باند به شما ضربه می زند.
.  نمره های PageSpeed​​Insights نباید با ارزش اسمی جایگزین شود.
.  بهبود ها با اندازه گیری، تعیین هدف و اولویت بندی به دست می آیند.

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

تاخیر(Latency) در بار گذاری بیشتر از پهنای باند به شما ضربه می زند.

اگر نگاهی به قوانین PageSpeed Insights بیاندازید، ممکن است این فکر را در ذهن شما ایجاد کند
که ارائه ی بیت و بایت کمتر به کاربران تنها کاری است که شما باید آن را انجام دهید.
کم کردن، بهینه سازی، فشرده سازی سایز هنوز نصف راه است، چون برای رسیدن در خواست
ساده شما به سرور زمانی را طلب خواهد کرد، همچنین جواب دادن به این در خواست مقدار زمان دیگری را طلب می کند.

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

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

به سرانجام رساندن یک در خواست کم و بیش نیاز مند مراحل زیر است.

１.  پیدا کردن سرور
２.  اتصال به سرور
３.  انتظار برای پاسخ
４.  دریافت پاسخ

هرکدام از این مراحل نیازمند زمان هستند. ۳ مرحله ی اول مستقل از زمان هستند،
و به طور موثر هزینه آن ها ثابت است. هزینه این در خواست ها صرف نظر از فایل درخواستی ثابت است،
پس اهمیتی ندارد کاربر یک فایل HTML ساده را در خواست می کند یا
یک فایل CSS فشرده و یا شاید یک فایل ویدیویی غیر فشرده با حجم بالا!

 

ابزار PageSpeed Insights چیست

PageSpeed Insights) PSI) عملکرد صفحه بر روی دستگاه های دستکاپ و موبایل را بررسی می کند
و سپس پیشنهاداتی در زمینه بهبود صفحه، ارائه می کند.
از انتهای سال 2018، PSI توسط Lighthouse قدرت بیشتری پیدا کرد.
این یعنی که نتایج ارائه شده در گزارش PSI مبتنی بر Lighthouse API هستند.

زمانی که این ابزار یک صفحه را اسکن می کند، دو نوع داده در رابطه با این صفحه به شما ارائه می کند:
داده های Lab و Field ( میدانی و آزمایشی).

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

اما، ممکن است در شرایط چالش بر انگیز در کاربردهای واقعی، خیلی داده های قابل اعتمادی نباشند.

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

چطور با استفاده از ابزار Page Speed Tool گوگل به امتیاز 100 از 100 برسیم

سرعت بارگذاری سایت از جمله فاکتورهای مهم و تاثیر گذار در تجربیات ایجاد شده برای کاربران است
و یکی از صدها فاکتور در رتبه بندی سئو محسوب می شود. واقعیت این است که امروزه، افراد تمایلی
به انتظار بیش از 5 ثانیه برای بارگذاری صفحات سایت ندارند. پس اگر سرعت بارگذاری سایت شما پایین است،
یعنی در حال از دست دادن مشتری هستید.

 

با توجه به این که بیشتر از 50 درصد ترافیک سایت از طریق دستگاه های موبایل ایجاد می شود،
افراد انتظار دارند که سایت تقریبا بلافاصله و در لحظه تقاضا بارگذاری شود. بنابراین، در این مقاله که آمیخته ای
از تجربیات شخصی من و مطالبی از وبسایت moz.cocm می باشد، تلاش می کنم به شما نشان دهم که
چطور با استفاده از ابزار Page Speed Insights گوگل می توانید هم برای کامپیوتر و هم برای موبایل امتیاز 100 از 100 را بدست آورید.

سرعت بارگذاری سایت ما از قبل بالا بود، اما باور ما این است که همیشه راهی برای بهتر شدن وجود دارد.
یک روز در حال بررسی ابزار PageSpeed متوجه شدم که سایت گوگل برای دستگاه های موبایل امتیاز
ضعیف 59 از 100 را دارد. نسخه کامپیوتری گوگل هم دارای امتیاز 89 از 100 است.

احتمالاً خود گوگل هم باید از این ابزار استفاده کند!
همین موضوع باعث شد سعی کنیم سرعت بارگذاری سایتمان را افزایش داده و
به شما هم ثابت کنیم که می توانید به امتیاز 100 از 100 برسید.

مرحله اول: بهینه سازی تصاویر

ابزار PageSpeed Insights به ما پیشنهاد کرد که حجم تصاویر را کاهش دهیم
تا سریع تر بارگذاری شوند. ما برای حل این مشکل دو کار مهم انجام دادیم:

1. حجم تمام تصاویر را با استفاده از ابزارهایی مثل Compressor.io و TinyPNG کاهش دادیم.
   این ابزارها رایگان هستند و در بعضی موارد می توانند بدون افت کیفیت، سایز فایل را تا 80 درصد کاهش دهند.
2. سپس سایز تمام تصاویر را به حداقل ابعاد ممکن کاهش دادیم بدون اینکه کیفیت عکس افت پیدا کند.
   مثلاً اگر بخواهیم از تصویری با ابعاد 150×150 پیکسل در سایت استفاده کنیم، سایز تصویر روی
   سرور خودمان هم باید به همین اندازه باشد. هیچ وقت نباید اندازه تصاویر بزرگتر از چیزی که قرار است ارائه شود،
   باشد و نباید سایز تصاویر را با استفاده از تگ های HTML یا CSS کاهش داد.

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

گوگل گزینه ای برای دانلود تصاویر بهینه سازی شده دارد که می توانید بلافاصله آن ها را به سرورتان آپلود کنید.
می توانید این کار را برای جاوا اسکریپت و CSS هم انجام بدهید.

مرحله دوم: کاهش حجم فایل های جاوا اسکریپت و CSS

در این مرحله گوگل به ما اعلام کرد که باید حجم فایل های CSS و جاوا اسکرپیت خودمان را کم کنیم.

این فرایند، سایز فایل ها را با حذف کردن فضاهای سفید، کاراکترها و کامنت های غیر ضروری
در فایل های جاوا اسکریپت و CSS کاهش می دهد. معمولاً برنامه نویس ها حین کدنویسی کامنت ها و
فضاهای خالی زیادی درج می کنند. ممکن است این کار سایز فایل های جاوا اسکریپت و CSS را حتی تا دو برابر افزایش دهد.

برای حل این مشکل می توان روی سرور ابزار Gulpjs را نصب کرد. این ابزار به صورت خودکار
یک فایل CSS ساخته و همه فاصله ها را حذف می کند. همچنین برای تمام تغییرات جدیدی که ایجاد می کنید،
یک فایل CSS جدید ایجاد می کند. این ابزار به ما کمک کرد که سایز فایل CSS اصلی خودمان
را تقریبا از 300 کیلوبایت به 150 کیلوبایت کاهش دهیم. این تفاوت ناشی از درج کاراکترهای غیرضروری بود.

برای کسب اطلاعات و راهنمایی بیشتر درباره چگونگی حذف فضاهای خالی، از راهنمای گوگل استفاده کنید.
البته اگر از وردپرس استفاده می کنید، توصیه می کنیم پلاگین Autoptimize را نصب کنید.

 

خلاصه مطلب

ابزار pagespeed insights
معرفی ابزار page speed insights
تاخیر(Latency) در بار گذاری بیشتر از پهنای باند به شما ضربه می زند.
ابزار PageSpeed Insights چیست
چطور با استفاده از ابزار Page Speed Tool گوگل به امتیاز 100 از 100 برسیم