چجوری سایت آلاء سریع و کم حجم شد ؟ و تغییرات جدید آلاء
-
سلام تو این مدت تقریبا هر روز بروزسانی داشتیم و آخر هفته ها هم که بروزرسانی خیلی جدی ارائه دادیم
قبل از هر چیزی بگم که همه این ها توسط تیم فنی خود آلاء انجام شده.
بخوام فقط تیتروار چند تا از اصلی ها رو نام ببرم، می تونم بگم کهاستفاده از فشرده سازی brotli
ما به فشرده سازی پاسخ های سرور که تو همه سایت ها، gzip هست، brotli رو اضافه کردیم که توسط گوگل ارائه شده و تقریبا 14 تا 27% بهتره، بنابراین دیوایسهایی که ساپورت کنند سرور بهشون با انکودینگ brotli پاسخ میده اگر نکنند هم با gzip.
بهینه سازی عکس ها در سایت آلاء
با فرمت های عکس باید آشنایی خوبی داشته باشید مثل jpg، png و... استفاده از gif که خیلی بده برای همینه که میگن فیلم mp4 بذار ولی gif نذار، هرچند خیلی ها رعایت نمی کنند و کاربراشون اذیت می شند.
پس عموما عکس ها ما jpg هستند ( اون هایی که نبودند رو تا دیدیم تبدیل کردیم )، تک و توک png هم پیدا میشه تو سایت.به کاربر احترام بذار و عکسی که نیاز داره رو بهش نشون بده
ما تو nginx سرور ماژولی رو کانفیگ کردیم که عکس ها رو تو ابعادی که کاربر نیاز داره ببینه تبدیل کنه و بر گردونه، در نتیجه کسی که با گوشی میاد تو سایت آلاء، عکس های کوچیک تر دانلود می کنه و کسی که با مانیتور 23 اینچی میاد، عکس بزرگتر دانلود می کنه.
فقط عکس هایی رو دانلود کن که نیاز داره ببینه
دیدی چقدر بده وارد یه سایت میشی تمام عکس های صفحه رو دانلود می کنه ؟ خوب اگر کسی دوست نداره چی کار باید بکنه ؟
ما مکانیزمی درست کردیم که عکس ها فقط تا اونجایی از صفحه که شما اسکرول کردی نشون داده میشن.استفاده از webp برای عکس های سایت
یادتونه بهتون گفتم ما عکس ها رو jpg کردیم، خوب یه فرمت دیگه هم هست که اگر اشتباه نکنم این رو هم گوگل باید داده باشه که خیلی فشرده تره و افت کیفیت خیلی کم تری داره، اما بدیش اینجاست که همه مرورگرها پشتیبانی نمی کنند ازش.
ما سیستمی سمت سرور پیاده کردیم که تشخیص میده مرورگر کاربر webp رو پشتیبانی می کنه یا نه اگرپشتیبانی کنه نسخه webp رو بر می گردونه و اگر نکنه jpg میده
طراحی برخی صفحات سایت که تغییر کردند
- مثل صفحه داشبورد کاربر ( فیلم و جزوه های من )
- امکان لایک کردن فیلم ها و دوره ها برای دسترسی سریع تر
- تغییر منوی سایت داخل گوشی و مگامنو در کامپیوتر
و....
-
