معیارتون چیه، چه سایتی سریع هست و چه سایتی رو کند میدونید؟
چه کارهایی باید انجام بدیم که سرعت سایتمون افزایش پیدا کنه؟
قراره فقط درمورد سرور صحبت کنیم.
اول کمی درمورد معیارهای سرعت سایت صحبت کنیم، مثلا زمانی که میگیم سایت کند شده با چه معیاری کندی سایت رو می‌سنجیم؟
من همیشه سرعت سایت رو به ۳ بخش تقسیم میکنم (شاید استاندارد باشه شاید هم نباشه)
داخل این تست ها پارامتر دیگه ای هم وجود داره که معمولا از کنترل ما خارج هست، اون هم اینترنت کاربره که ممکنه برای یک تست ثابت نتایج مختلفی ارایه کنه.
برای کنترل این بخش پیشنهاد میکنم از جاهای مختلف تست بشه و البته نتیجه تست ها هم بصورت میانگین محاسبه بشه.
TTFB
مورد اول مربوط به اتصال TCP میشه و ربطی به محتوای سایت نداره، یعنی قبل از اینکه اصلا بخوایم ببینیم تصاویر سایت بهینه هستند یا نه یا بکند سریع جواب میده، باید ببینیم کاربر چقدر زمان میبره تا دامنه رو ریزالو کنه و بتونه کانکشن TCP بزنه.
برای این تست میشه از سایت های آنلاین مثل https://performance.sucuri.net استفاده کرد، انصافا سایت خوبی هم هست.
ولی من ابزارهای دستوری رو بیشتر ترجیح میدم، با curl هم میشه این زمان رو بدست آورد.
با دستور زیر دارم چک میکنم سرعت اتصال به سایت ویرگول چقدر هست:
curl -L -o /dev/null -w "Connect: %{time_connect} TTFB: %{time_starttransfer} Total time: %{time_total} \n" https://virgool.io/
خروجی این دستور به اینصورت هست:
Connect: 0.060190 TTFB: 1.496674 Total time: 1.654540
سرعت اتصال به سایت ویرگول از روی اون سایت های آنلان هم این شکلی هست:
میشه سرعت اتصال رو افزایش داد و درمجموع این زمان رو کم کرد؟
برای بهبود زمان اتصال TTFB کارهای متعددی باید انجام بشه که به بخشی از اون ها اشاره میکنم:
بهینه سازی محتوای استاتیک
تست این بخش خیلی ساده است، از روی سایتتون یک تصویر رو انتخاب کنید و اون رو دانلود کنید.
با این کار مجموع TTFB و سرو فایل رو تست کردید، البته که این تست هم شامل اون قاعده کیفیت اینترنت کاربر هست.
curl -o /dev/null -w "Total time: %{time_total} \n" https://files.virgool.io/upload/users/38106/posts/ihpkxqooh5r3/rsppmtuhzcd9.jpeg
با این درخواست یک تصویر رو مستقیم از روی سرور دانلود میکنم و خوبه که حواسمون باشه درخواست ما به جای دیگه ریدایرکت نشه و مستقیم بریم لینک نهایی رو تست کنیم.
100 106k 100 106k 0 0 122k 0 --:--:-- --:--:-- --:--:-- 122k
Total time: 0.871299
خروجی دستور نشون میده که فایل 106k رو در مدت 0.8 ثانیه دریافت کردم.
چطور میشه این زمان رو بهبود داد؟
از سایت های آنلاین هم میشه استفاده کرد، مثلا این سایت تحلیل خوبی ارایه میکنه.
ضمنا برای تست زمان لود سایت از نقاط مختلف دنیا، این سایت رو پیشنهاد میکنم.
بهینه سازی استاتیک
کم هزینه ترین کار همین بهینه سازی تصاویر هست، مثلا ممکنه شما تصویری با اندازه 1017 × 1589 داشته باشید ولی داخل سایت تصویر رو با تگ HTML یا CSS کوچکتر نمایش بدید، نتیجه این هست که تصویر بزرگ باید توسط کاربر دانلود بشه ولی زمان نمایش تصویر کوچکتر نمایش داده میشه.
با اصلاح اندازه تصاویر و تبدیل به فرمت های بهینه وب میتونیم سرعت سایت رو افزایش بدیم.
روش بعدی بهینه سازی تصاویر بصورت داینامیک هست، این کار رو به روش های مختلفی میتونیم پیاده سازی کنیم.
مثلا هر تصویری که روی سرور آپلود میشه، بلافاصله به اندازه های مختلف تبدیل بشه تا برای مواقع مختلف هم اندازه بهینه نمایش داده بشه.
این کار هزینه زیادی داره و ممکنه برخی از اندازه ها اصلا دیده نشدند درحالی که شما از پیش با هزینه CPU تصاویر رو Resize کردید.
بهینه سازی داینامیک
روش دیگه پیاده سازی هم بصورت داینامیک هست، یعنی شما تصویر رو با اندازه واقعی به سرور منتقل میکنید ولی زمان نمایش فقط اون سایز یا بخشی از تصویر رو که نیاز دارید نشون میدید.
تصویر زیر مربوط به Object Storage ویرگول هست که از همین روش استفاده میکنه:
https://files.virgool.io/upload/users/38106/posts/ihpkxqooh5r3/rsppmtuhzcd9.jpeg
تصویر اصلی 106k هست ولی زمانی که میخواد بخشی رو نمایش بده، از این آدرس استفاده میکنه:
https://files.virgool.io/upload/users/38106/posts/ihpkxqooh5r3/rsppmtuhzcd9.jpeg?x-oss-process=image/resize,w_700/crop,h_250,g_center/quality,q_80
درواقع داره تصویر رو Crop میکنه و البته کیفیت رو هم پایین میاره، اندازه این تصویر فقط 12k هست.
خب این کار معمولا در لحظه هزینه بر هست که با اضافه کردن مکانیزم های لایه کش میانی میتونه بهینه عمل کنه.
روش دیگه ای هم هست که اتوماتیک این کار رو انجام میده، ماژولی برای Nginx و Apache هست به نام PageSpeed، این هم آدرس سایت.
با این روش میتونید تصاویر، JS و CSS ها رو روی سرور بهینه کنید و با اندازه بسیار کمتری به کاربر نمایش بدید.
این تصویر در اندازه واقعی و بدون ماژول PageSpeed نمایش داده میشه که حدود 1.8M هست:
curl -L -o /dev/null -w "Connect: %{time_connect} TTFB: %{time_starttransfer} Total time: %{time_total} \n" https://SITE/kratos_atreus_in_god_of_war-hd_wallpapers.jpg 100 1829k 100 1829k 0 0 551k 0 0:00:03 0:00:03 --:--:-- 551k Connect: 0.157250 TTFB: 0.280794 Total time: 3.327236
حالا همین تصویر و با ماژول فعال PageSpeed بصورت اتوماتیک میشه 425k:
100 425k 100 425k 0 0 487k 0 --:--:-- --:--:-- --:--:-- 487k Connect: 0.077811 TTFB: 0.179278 Total time: 0.874382
خیلی ساده خود وب سرور تصویر رو کوچکتر و کیفیت اون رو کاهش میده تا کاربر در زمان کمتری تصویر رو دریافت کنه، این کار هم خوبه و هم بده!
اگر ماژول PageSpeed رو به خوبی تنظیم کرده باشید و یا با اطلاع کامل فایلی رو با اندازه بزرگ بخواهید که نمایش بدید خوبه ولی اگه فقط ماژول رو نصب کنید و تنظیمات دقیقی روش انجام ندید همین میتونه کیفیت سایت شما رو کم کنه.
تنظیمات PageSpeed مفصل و متعدد هست، توی مقاله دیگه ای نصب و تنظیمات رو براتون کامل توضیح میدم.
استفاده از CDN
معمولا سایت ها منابع محدودی دارند و برخی مواقع به جای استفاده از این منابع برای پردازش داینامیک درحال پاسخ دادن به درخواست های استاتیک هستند.
شیوه بهینه جدا کردن سرور فایل های استاتیک هست که بهترین روش اجرا پیاده سازی CDN هست، ولی راه اندازی CDN هزینه بر هست و البته کمی هم نیاز به دانش و تجربه داره.
معمول ترین روش استفاده از Cloudflare هست، البته استفاده از CDN های خارجی معمولا به دلیل اتصال به اینترنت خارج از کشور و کیفیت اینترنت ممکنه بهینه نباشه و سرعت رو هم کاهش بده.
** دارم مسیر اتصال به یکی از سرورهای Cloudeflare رو بررسی میکنم که نشون بدم اتصال کند هست و خوب نیست، ولی دارم میبینم که چقدر خوب مسیر روتینگ بهینه شده و حتی از بعضی سایت های داخلی هم سرعت بهتری داره!
همین مثال files.virgool.io رو ببینیم که از Cloudflare سرویس میگیره:
dig files.virgool.io +short 104.27.173.131 104.27.172.131
whois 104.27.173.131 | grep NetName NetName: CLOUDFLARENET
نمیگم خیلی خوبه ولی قابل قبوله!
بجز سرویس دهنده های خارجی، CDN های داخلی هم داریم که به نظر میرسه کیفیت خوبی دارند و اگر هم ایرادی بهشون گرفته میشه، تلاش میکنند تا رفع بشه، مثل ابرآروان یا خلاق (البته نمیدونم پابلیک هست یا نه).
*(اگر ارایه دهنده ایرانی دیگه ای سراغ دارید بگید تا اضافه کنم)
بهبود پرفرمنس وب سرور
این بهینه سازی ارتباط مستقیمی با منابع سرور و تعداد درخواست هایی که بهش ارسال میشه داره.
مثلا بهینه سازی وب سروری که فایل های بزرگ سرو میکنه با سروری که فایل های کم حجم ولی با تعداد بالا سرو میکنه متفاوت هست، البته بخش هایی از بهینه سازی مشترک هستند و همواره باید انجام بشه.
این مبحث خیلی مفصل هست و ترجیح میدم توی مقاله دیگه ای درموردش توضیح بدم، این آدرس از خود سایت Nginx میتونه منبع خوبی برای شروع این کار باشه.
افزایش کیفیت و ظرفیت پهنای باند سرور
این کار خیلی سخت هست! درواقع شما باید سرویس دهنده تون رو قانع کنید که کیفیت شبکه و یا اینترنت سرور خوب نیست.
درواقع این مورد یک جورهایی بیرون از حوزه شماست و شاید کارهایی که میتونید انجام بدید این ها باشند:
بهینه سازی محتوای داینامیک
برای بهینه سازی این بخش باید موارد متعددی رو در نظر گرفت و انصافا کار زمانبر و سختی هست:
همونطور که گفتم این بخش کمی پیچیده است و باید بصورت گام به گام انجام بشه،
جمع بندی
بهینه سازی و افزایش سرعت سایت موارد متعددی داره که سعی کردم مختصری به اون ها اشاره کنم، مواردی مثل بهینه سازی وب سرور Nginx و استفاده از PageSpeed رو بعدا منتشر میکنم.
باید توجه داشته باشیم که برای بهبود سرعت نمیشه پارامتر شبکه یا اتصال کاربر رو نادیده گرفت لذا ممکنه هر کاربری تجربه خاص اتصال خودش رو داشته باشه، پس پیشنهاد میکنم بجای بررسی صرفا زمان لود سایت به آنالیز پارامترها توجه کنید، این موارد رو میتونید توی سایت های تحلیل آنلاین یا حتی Developer Tools مرورگر پیدا کنید.
موفق باشید
مسعود یوسف پور
