تسريع الموقع وتقليل حجمه قبل رفعه على السيرفر في php

بطء الموقع يمكن أن يكون نتيجة عدة أسباب رئيسية، مثل حجم الصور الكبيرة، أو كثرة ملفات CSS وJavaScript، أو استعلامات قاعدة البيانات غير المحسنة او امكانيات الاستضافه وهذه اهم الحلول لتحسين سرعة الموقع

1. تقليل حجم الصور وتحسينها

الصور الكبيرة هي من أكبر أسباب بطء الموقع، لأنها تستهلك وقتًا أطول للتحميل.

وحلها هو ضغط الصور قبل رفعها:
استخدم مواقع مثل TinyPNG لضغط الصور مع الحفاظ على جودتها واستبدل صيغ الصور التقليدية (مثل PNG وJPEG) بصيغة WebP التي توفر جودة عالية مع حجم أقل.

2. دمج وتقليل ملفات CSS و JavaScript

كل ملف CSS أو JavaScript يتم تحميله في طلب منفصل (HTTP Request)، ما يزيد من وقت تحميل الصفحة.

وحلها هو دمج الملفات:
اجمع جميع ملفات CSS في ملف واحد، وجميع ملفات JavaScript في ملف واحد لتقليل عدد الطلبات.

تصغير الملفات (Minify):
استخدم Laravel Mix لتقليل حجم الملفات وضغطها.مثال:

npm run prod

يقوم هذا الأمر بتجميع وتصغير الملفات الجاهزة للإنتاج.

3. استخدام التحميل المؤجل للصور (Lazy Loading)

التحميل المؤجل يعني عدم تحميل الصور غير المرئية على الشاشة حتى يحتاج المستخدم إليها. هذا يُسرّع تحميل الصفحة.

وتطبيقه ان تضيف الخاصية loading="lazy" إلى الصور في HTML:

<img src="image.jpg" alt="صورة" loading="lazy">

بهذا يتم تحميل الصور عند التمرير نحوها فقط.

4. تحسين الاستعلامات مع قاعدة البيانات

الاستعلامات الكبيرة أو غير المحسنة تستهلك وقتا أطول، خاصة إذا كنت تجلب بيانات لا تحتاجها.

لذلك يجب جلب البيانات المطلوبة فقط لذلك لا تستخدم

$users = User::all();

بدلا من ذلك، استخدم:

$users = User::select('name', 'email')->get();

ومن الممكن استخدام التخزين المؤقت (Cache) لتجنب إعادة تنفيذ الاستعلام في كل مرة، 

$users = Cache::remember('users', 60, function () { return User::all(); });

ومن المهم جدا استخدام Eager Loading:لتحسين جلب البيانات المرتبطة، 

$users = User::with('posts')->get();

تطبيق هذه الخطوات سيُحسّن أداء موقعك بشكل كبير، ويُوفّر تجربة أفضل للمستخدمين

@Khaled Osama3

اتذكر انه كان هناك طريقة تقوم بضغط جميع الملفات قبل تحميلها للموقع وتوضع داخل مجلد ما ويتم رفع فقط هذا المجلد على السيرفر وتكون الاكواد بداخل هذا المجلد مكتوبة بطريقة معجوقة جدا ويستحيل التعديل عليها ولكنني لا اذكر اسمها

أنت تتحدث عن عملية "Minification and Bundling"، وهي جزء من عملية التحسين التي تُستخدم لتقليل حجم ملفات الموقع وجعلها جاهزة للنشر على بيئة الإنتاج. الأدوات التي تقوم بهذه العملية تقوم بجمع كل الأكواد (CSS/JavaScript) معًا، ثم تضغطها (Minify) لجعلها أصغر حجمًا وأصعب قراءة (أكواد "معجوقة")

وقد تكلمت عليها بالاعلي وهي Laravel Mix فهو أداة مبنية على Webpack، تستخدم مع Laravel لتسهيل عملية تجميع وضغط الملفات.

بعد إعداد الملفات في مشروع Laravel، يمكنك تشغيل الأمر:

npm run prod

يدمج كل ملفات CSS/JavaScript في ملفات واحدة ويجري تصغير (Minification) للأكواد، مما يجعلها مضغوطة جدا وغير قابلة للتعديل يدويا

وينتج الملفات الجاهزة داخل مجلد public/js و public/css.