كيف تسرّع موقعك؟ القياس أولًا ثم أكبر المكاسب

الزائر لا يرى الكود ولا الخادم؛ يرى شاشة بيضاء أو صفحة تظهر فورًا. ولأن معظم زيارات المواقع في السعودية والإمارات ومصر تأتي من الهواتف، وأحيانًا عبر شبكات متغيرة الجودة، فالسرعة ليست ترفًا تقنيًا بل جزء من تجربة الشراء والثقة. هذا الدليل يرتّب العمل بحسب الأثر: ابدأ بالقياس، ثم أصلح ما يعطي أكبر تحسن بأقل جهد.

الخطوة الأولى: قِس بشكل صحيح

لا تعتمد على شعورك ولا على سرعة الموقع على حاسوبك المكتبي المتصل بالألياف. استخدم أداة اختبار سرعة الموقع وانتبه إلى:

• اختبر صفحات مختلفة: الصفحة الرئيسية، صفحة فئة، صفحة منتج أو مقال. غالبًا تكون صفحة المنتج هي الأبطأ.
• اختبر الجوال أولًا: فهو ما تعتمد عليه Google في التقييم، وهو ما يستخدمه أغلب زوارك.
• كرّر الاختبار ثلاث مرات وخذ المتوسط.
• فرّق بين بيانات المختبر وبيانات الميدان: الأولى محاكاة لجهاز وشبكة محددين، والثانية من متصفحات زوار حقيقيين. شرحنا ذلك في دليل Core Web Vitals.

أهم الأرقام التي تتابعها:

المكسب الأكبر غالبًا: الصور

في معظم المواقع التي نفحصها، تشكّل الصور أكثر من نصف وزن الصفحة. صورة واحدة من كاميرا الجوال قد تبلغ 4–6 ميغابايت، بينما تكفي نسخة بعرض 1200 بكسل ووزن 150 كيلوبايت.

1. غيّر الأبعاد إلى أكبر عرض يُعرض فعليًا.
2. اضغط الصور عبر أداة ضغط الصور؛ جودة 75–85% لا يلاحظ فرقها أحد غالبًا.
3. استخدم صيغًا حديثة: حوّل JPEG وPNG إلى WebP عبر محوّل WebP، أو إلى AVIF إن كانت منصتك تدعمه.
4. أضف loading="lazy" للصور أسفل الصفحة، ولا تضفه لصورة البانر الأولى التي غالبًا تكون عنصر LCP.
5. حدّد width وheight لكل صورة لمنع اهتزاز التخطيط.

التفاصيل الكاملة في دليل تحسين الصور للويب.

الخادم والاستضافة

إذا كان TTFB أعلى من ثانية، فلن تنقذك أي حيلة في الواجهة.

• قرب الخادم من الزوار: خادم في أمريكا الشمالية لزوار في جدة يضيف زمن رحلة كبيرًا لكل طلب. مزودو السحابة الكبار لديهم اليوم مناطق في الخليج، وكثير من الاستضافات تتيح خوادم في أوروبا القريبة نسبيًا.
• الاستضافة المشتركة الرخيصة تتشارك فيها مئات المواقع الموارد نفسها، فتتباطأ في أوقات الذروة.
• التخزين المؤقت للصفحات (page cache): في ووردبريس، إضافة تخزين مؤقت أو تخزين على مستوى الخادم يحوّل كل طلب من تنفيذ PHP واستعلامات قاعدة بيانات إلى تقديم ملف جاهز.
• إصدار PHP حديث وقاعدة بيانات نظيفة دون آلاف المراجعات والجداول اليتيمة.
• ضغط Brotli أو gzip للنصوص (HTML وCSS وJS).

JavaScript والخطوط والسكربتات الخارجية

بعد الصور، JavaScript هو المتهم الثاني، خصوصًا في مؤشر INP:

• احذف ما لا تستخدمه: إضافات ووردبريس المعطلة وظيفيًا لكنها ما زالت تحمّل ملفاتها، ومكتبات قديمة مثل سلايدر في الصفحة الرئيسية.
• راجع السكربتات الخارجية: أدوات الدردشة، وبكسلات الإعلانات المتعددة، وخرائط Google المضمّنة، وأدوات التحليل المكررة. كل واحدة منها تحمّل عشرات الملفات.
• أجّل غير الضروري بـ defer أو حمّله بعد التفاعل.
• الخطوط العربية ثقيلة: الخط العربي الكامل قد يتجاوز 100–200 كيلوبايت لكل وزن. استخدم وزنين على الأكثر، وصيغة WOFF2، وقسّم الخط (subset) إلى الأحرف المستخدمة، وأضف font-display: swap حتى يظهر النص فورًا بخط احتياطي.

<link rel="preload" href="/fonts/arabic-regular.woff2" as="font" type="font/woff2" crossorigin>

التخزين المؤقت في المتصفح وCDN

الملفات الثابتة (الصور، CSS، JS، الخطوط) لا تتغير في كل زيارة. أخبر المتصفح أن يحتفظ بها:

Cache-Control: public, max-age=31536000, immutable

استخدم هذا فقط للملفات التي يتغير اسمها عند تعديلها (مثل style.a1b2c3.css). أما HTML فاجعل تخزينه قصيرًا.

شبكة توصيل المحتوى (CDN) مثل Cloudflare تنسخ ملفاتك إلى خوادم قريبة من الزوار، ولديها نقاط في معظم دول الخليج ومصر والمغرب. الخطة المجانية كافية لكثير من المواقع الصغيرة.

أخطاء تبطئ المواقع العربية بشكل خاص

• سلايدر بخمس صور عملاقة في أعلى الصفحة الرئيسية: صورة واحدة ثابتة غالبًا أسرع وأوضح في الرسالة.
• فيديو تعريفي يعمل تلقائيًا من YouTube في أعلى الصفحة: استبدله بصورة مصغرة لا تحمّل المشغّل إلا عند النقر.
• قوالب “متعددة الأغراض” تحمّل مكتبات لكل الميزات حتى ما لا تستخدمه.
• تحويلات متتالية من http إلى https ثم إلى www: كل خطوة رحلة إضافية. راجع دليل التحويلات.

قياس الأثر على الأعمال

السرعة ليست هدفًا بذاتها؛ الهدف هو أن يكمل الزائر الشراء أو يرسل الطلب. لذلك اربط التحسين بالأرقام التي تهمك:

• قارن معدل الارتداد ومعدل التحويل على الجوال قبل التعديلات وبعدها بأسبوعين على الأقل.
• راقب صفحات الدفع والسلة تحديدًا؛ بطء خطوة الدفع أكثر تكلفة من بطء مقال في المدونة.
• انتبه إلى أن السكربتات التسويقية (بكسلات الإعلانات، أدوات التتبع) قد تكون أبطأ جزء في الصفحة، لكن حذفها قرار تجاري يحتاج اتفاقًا مع فريق التسويق؛ الحل الوسط هو تحميلها بعد التفاعل أو عبر إدارة الوسوم بشروط.

ترتيب العمل المقترح

1. الصور (أسرع مكسب وأقل خطر).
2. التخزين المؤقت للصفحات والملفات الثابتة.
3. حذف الإضافات والسكربتات غير الضرورية.
4. الخطوط والـ CSS الحاجب للعرض.
5. الاستضافة وCDN إذا بقي TTFB مرتفعًا.

قائمة تحقق التسريع

• قِست الصفحات الأهم على الجوال، وسجّلت الأرقام قبل التعديل.
• الصور بأبعاد مناسبة ومضغوطة وبصيغة WebP أو AVIF، وصورة LCP غير مؤجلة.
• TTFB أقل من 0.8 ثانية مع تخزين مؤقت للصفحات.
• ضغط Brotli أو gzip مفعّل، وتخزين طويل للملفات الثابتة.
• الإضافات والسكربتات الخارجية في حدها الأدنى.
• الخطوط العربية بصيغة WOFF2 ومقسّمة ومع font-display: swap.
• CDN مفعّل إن كان الخادم بعيدًا عن الجمهور.
• أعدت القياس بعد كل تعديل لتعرف ما الذي أحدث الفرق.