أفضل الطرق لتسريع موقعك

بعد عدة تحسينات في سرعة موقعي الشخصي أشارككم في هذه المقالة طرق لجعل موقعكم اسرع.
1- جهة باك اند (backend side)
- تخلص من كافة الاكواد مكررة والتي لاتحتاجها فمثلا لاتقم باستدعاء مكتبة لاتستخدمها ولاتقم باستخدام جرافة لحفر حفرة صغيرة يعني لاتستخدم مكتبة من اجل خاصية صغيرة توفرها قم ببرمجتها بنفسك او ابحث عن مكتبة اصغر او توفر تلك خاصية فقط
- ‏قم باستخدام البرمجة غير تزامنية asynchronous التي تسمح لك باستدعاء اجراءات دون انتظار الاجراء التي قبلها فبعض اللغات توفر هذا نوع من برمجة مثل nodejs واذا لم تتوفر استخدم خاصية تشغيل اكواد في خلفية background كمثال استخدام jobs في laravel
- ‏استخدم الكاش cache فمثلا نتائج استعلام قمت بعمله سابقا يمكنك عمل cache له عن طريق ملفات او عن طريق قاعدة بيانات تعتمد على ram مثل redis او memcached
- استخدم indexes عند استعلامك من قاعدة بيانات فهي تسرع عملية بحث داخل جداول
- ‏قم بتحديث اصدار لغة برمجية او فريمورك مستخدد لاحدث اصدار او الاصدار مستقر stable
- لاتقم بتخزين كامل لصور او ملفات او اي شيء binary المرفوعة في قاعدة بيانات بل ارفعه واحفظ رابطه فقط
- ‏استخدم قواعد بيانات علائقية relationship database وقلل من تكرار استعلام من قاعدة بيانات
- ‏ابتعد عن استدعاء وظائف التي تحتاج loop في نفس كود استعلام مستخدم كمثال : ارسال اشعارات - او ارسال بريد او نشرة بريدية...الخ واستخدم تشغيل في خلفية او اجراء asynchronous
- ‏عند قراءة ملفات ذات حجم كبير لاتقرأها ككتلة واحدة بل استخدم stream لتقسيمه لوحدات وقراءته قطعة قطعة حتى لايتسبب في استهلاك رام
- ‏في وظائف التي تحتاج تحديث لحظي لاتقم بارسال استعلام كل دقيقة مايسمى long polling عن طريق ajax بل استخدم مكتبات وتقنيات متخصصة في real time ك socket
- لاتضحي بال performance على حساب code quality او الوقت Deadline وتقوم بملأ كودك بالكثير من مكتبات فبعض مكتبات لم يتم عمل optimise لها
- ‏قم بتقسيم برمجيتك لعدة برمجيات صغيرة micro services وتستدعي بعضها البعض حسب احتياج
- ‏قم بضغط صور مرفوعة وتحويلها الى jpg لانها اقل حجما من باقي صيغ كذلك عند رفعك لصورة قم بانشاء نسختين واحدة اصلية وواحدة اقل حجما لعرضها في صور رمزية وصور مصغرة
2- جهة فرونت اند (frontend side)
- استخدم ملفات js و css المضغوطة ماتسمى ب minified
- استخدم خدمة cdn لاستضافة ملفات assets الخاصة بمموقعك كملفات js و css فهي تسرع عملية تحميل عن طريق نظام متطور لاستعلام من اقرب سرفر لك (ساخصص ثريد خاص بشرح cdn)
- استخدم صور svg للصور اقل تعقيدا في الالوان كايقونات او عناصر رسومية graphics فهي اسرع في تحميل من صور عادية
- ‏لاتستخدم صور اصلية في كافة جهات موقعك بل اعرض خصص لكل ابعاد صورة خاصة مثلا للavatar صورة ببعد : 60x60 ولل thumbnail ابعاد 120x120 وهكذا، حتى لاتضطر لتحميل نفس صورة اصلية ذات حجم كبير لابعاد مختلفة
- ‏في بعض حالات استخدم css background image بدل img tag لانها اسرع في تحميل والعرض
- ‏ابتعد عن عرض صور بصيغة base64
- استخدم mod_expires لتحديد عمر ومجال cache الخاص بالصور وملفات css وjs
- استخدم حركة تحميل spinner loading حتى تخبر الزائر انه يقوم بإجراء ما ولم ينتهي منه حتى لايحس بالبطء اثناء ارسال استعلام او القيام بوظيفة ما.
هذي اهم الاشياء البسيطة التي تساهم بتحسين سرعة موقعك ويمكنك ايضا الاستعانة بأداة PageSpeed insight مطورة جوجل لقياس سرعة موقعك وتعطيك نصائح لزيادة سرعته

أداة جوجل
PageSpeed Insights
روابط قد تفيدك 
ماهو frontend و backend؟
ماهي صور svg؟