تحسين سرعة الموقع: ليش موقعك بطيء وكيف تقيسه وتصلحه بنفسك

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

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

ليش سرعة الموقع تهم أصلاً

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

كيف تقيس سرعة موقعك بنفسك (مجاناً، خلال خمس دقايق)

افتح PageSpeed Insights وحط رابط الصفحة. تطلع لك نتيجتين من مصدرين مختلفين، وأغلب الغلط يجي من خلط الاثنين. اختبر الجوال أول شي، واختبر صفحتين: الرئيسية، والصفحة الي تجيها الزيارات فعلاً (صفحة الإعلان أو الخدمة).

1. بيانات المستخدمين الفعليين (القسم العلوي)

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

• هي حصيلة آخر 28 يوم. لو صلحت موقعك اليوم، هذا القسم يتحرك تدريجياً خلال أسابيع. لا تحكم عليه بكرة.
• الرقم مو متوسط، هو الشريحة 75. يعني ثلاثة أرباع الزيارات وصلها هذا الرقم أو أفضل، والربع الباقي أسوأ. والصفحة تنجح لما يكون جيد في المؤشرات الثلاثة.
• الموقع الصغير ممكن ما تطلع له بيانات. إذا زيارات الصفحة قليلة، الأداة تعرض بيانات الموقع كله، وإذا ما كفت ما تعرض شي. فتأكد الرقم لصفحتك ولا لموقعك كله.

المؤشر	وش يقيس	جيد	ضعيف
LCP	متى يظهر أكبر عنصر في الشاشة، صورة أو نص	2.5 ثانية أو أقل	فوق 4 ثواني
INP	كم تتأخر الصفحة في الرد لما تضغط أو تكتب	200 ملي ثانية أو أقل	فوق 500 ملي ثانية
CLS	كم تتحرك العناصر وأنت تتصفح	0.1 أو أقل	فوق 0.25
TTFB (مساعد، مو من الثلاثة)	متى يوصل أول رد من الخادم	800 ملي ثانية أو أقل	فوق 1800 ملي ثانية

الي بين الخانتين تصنفه الأداة «يحتاج تحسين».

2. الاختبار المحاكي (القسم السفلي)

أداة Lighthouse تحمّل صفحتك على جهاز واحد متوسط (Moto G4) وشبكة جوال، وتعطيك درجة: 90 وفوق جيد، من 50 إلى 89 يحتاج تحسين، وتحت 50 ضعيف. هذا القسم يدلك على السبب، بس ما يحكم على موقعك:

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

وفيه أدوات ثانية مثل GTmetrix وWebPageTest تعرض لك تحميل الملفات بالتفصيل. الأدوات ما تقيس LCP كلها بنفس الطريقة، فقارن الأداة بنفسها قبل وبعد، مو أداة بأداة. ولمتابعة الموقع كله، افتح تقرير مؤشرات الويب الأساسية في Search Console.

أهم خطوة: اعرف وش أكبر عنصر قبل ما تصلح شي

في قسم التشخيص، فلتر LCP يوريك العنصر بالضبط وكيف انقسم وقته. قوقل يقسم هذا الوقت لأربع أجزاء، ومن هنا تعرف وين تشتغل:

الجزء	وش يصير فيه	وش يطوله عادة
وقت أول رد (TTFB)	تنتظر أول جزء من الصفحة	خادم بعيد أو مزدحم، تحويلات، صفحة تنبني من الصفر
تأخر بدء التحميل	المتصفح ما بدأ ينزل العنصر	خلفية من CSS، صورة يضيفها JavaScript، تحميل كسول على صورة الأعلى
مدة التحميل	العنصر نفسه ينزل	صورة كبيرة، ملف خط كبير، مسافة بعيدة
تأخر الظهور	نزل بس ما ظهر	ملفات تسد العرض، صفحة تنتظر JavaScript، مكتبة تجارب تخفي العنصر

الجزأين الي فيهم كلمة «تأخر» المفروض يقربون من الصفر. وهذا يفسر خيبة تتكرر: قوقل يعطي مثال لصفحة عنصرها الأكبر مخفي لين يخلص JavaScript، تضغط صورتها فينقص وقت تنزيلها، وLCP ما يتغير، لأن الوقت انتقل من جزء لجزء.

والعنصر الأكبر ممكن ما يكون صورة أصلاً. في صفحات موقعنا هو العنوان العربي، فلو ضغطنا كل الصور ما يتحرك LCP، الي يحركه ملف الخط.

ليش موقعك بطيء؟ ستة أسباب تتكرر

1. الصور

صور من الكاميرا بحجم ميغابايتات، بدون ضغط، بدون صيغة حديثة (WebP أو AVIF)، وكلها تنزل من أول ثانية حتى الي في آخر الصفحة. والمقاس يفرق حتى بعد الضغط: خمس صور مشاريع في صفحتنا الرئيسية، كلها أصلاً WebP، مجموعها 474 كيلوبايت بعرضها الأصلي 1144 بكسل، والجوال يعرضها بعرض حوالي 330 بكسل. جهزنا نسخ أصغر يختار منها المتصفح (srcset)، فصار مجموع نسخ 640 بكسل 125 كيلوبايت.

الحل: ضغط، صيغة حديثة، مقاسات للجوال، أبعاد مكتوبة لكل صورة (width وheight) عشان الصفحة ما تتحرك، وتحميل كسول للي تحت. وصورة الأعلى تستثنى: loading="lazy" يأخرها وfetchpriority="high" يقدمها. وإذا كانت خلفية من CSS، المتصفح ما يكتشفها إلا بعد ما ينزل ملف التنسيق، فخلها صورة عادية في الصفحة أو حملها مسبقاً بـ preload.

2. الخطوط العربية

خط من خادم خارجي، أربع أوزان وأنت تستخدم اثنين، وملف فيه حروف لغات ما تعرضها. والمتصفح عادة يأخر عرض النص لين يوصل الخط، فإذا العنوان هو أكبر عنصر، الخط هو الي يحدد LCP.

في موقعنا كان ملف تنسيق Google Fonts أكبر طلب يعطل العرض، حوالي 1.3 ثانية على الجوال لما قسناه. بدلناه بملف خط متغير واحد بصيغة WOFF2 يغطي الأوزان من 400 إلى 700، للنطاق العربي بس، حجمه حوالي 22 كيلوبايت، ومعرّف مباشرة في رأس الصفحة.

الحل: ملف متغير أو وزنين، WOFF2، والحروف الي تستخدمها بس (تأكد إن رخصة الخط تسمح)، وfont-display: swap عشان النص يظهر بخط مؤقت لين يوصل الخط. وانتبه لشيئين: الاستضافة عندك مو دايم أسرع، قوقل يقول الفرق مو محسوم ويربطه بوجود CDN وHTTP/2. والتبديل نفسه ممكن يحرك النص إذا الخط المؤقت مقاسه غير مقاس خطك، فتخسر في CLS الي كسبته في LCP. قس الاثنين.

3. السكربتات الخارجية

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

مكتبة Google Analytics عندنا حوالي 190 كيلوبايت. كانت تنزل جنب ملفات الصفحة نفسها على الجوالات البطيئة، فصارت ما تنزل إلا بعد ما تظهر الصفحة ويفضى المتصفح، أو مع أول ضغطة من الزائر. الأحداث قبل كذا تنتظر في طابور وما تضيع، والثمن إن الي يقفل قبلها ما ينحسب.

الحل: احذف الي ما أحد يفتح تقاريره، أضف async أو defer لأي سكربت في رأس الصفحة، وخل الخريطة والفيديو صورة ثابتة تتحمل لما يضغطها الزائر. وزر واتساب ما يحتاج أداة أصلاً: رابط wa.me عادي يكفي بدون أي كود خارجي، وكذا هو عندنا. وبعد أي أداة تأخير، تأكد من تبويب Network إن السكربت فعلاً تأخر.

4. الإضافات والقالب

في ووردبريس الإضافة ممكن تحمل ملفاتها في كل صفحة، حتى الي ما تستخدمها. ومثلها محررات الصفحات الثقيلة وقوالب السلايدر.

الحل: في نسخة تجريبية، وقف الإضافات وحدة وحدة وقس بعد كل وحدة، واحذف الي ما له داعي. حدّث ووردبريس وPHP ونظف قاعدة البيانات. وإذا التقرير يوري إن أغلب الكود غير المستخدم جاي من القالب، جرب قالب أخف قبل ما تفكر في موقع جديد.

5. الخادم: الاستضافة والتخزين المؤقت والتحويلات

هذا مكانك إذا TTFB عالي، لأن كل شي ينتظر أول رد. الأسباب المعتادة: استضافة مشتركة مزدحمة، خادم في قارة ثانية، صفحة تنبني من الصفر لكل زائر، وتحويلات متتالية (من رابط مختصر إلى http إلى www إلى الصفحة).

فخ الإعلانات: روابط الإعلانات فيها وسيطات تتبع مثل gclid وfbclid قيمتها تتغير مع كل ضغطة. إذا الـ CDN يعتبر كل قيمة صفحة جديدة، كل زائر من الإعلان يرجع للخادم الأصلي بدل النسخة الجاهزة. فالصفحة سريعة لما تفتحها أنت، وبطيئة لكل من دفعت عليه. اختبرها بالرابط الكامل حق الإعلان، واضبط التخزين المؤقت يتجاهل هذي الوسيطات.

الحل: تخزين مؤقت للصفحات وللملفات الثابتة، CDN (واسأل المزود عن أقرب نقطة لزوارك بدل ما تفترض)، وأقل عدد من التحويلات. وبعدها فكر في نقل الاستضافة.

6. طريقة بناء الموقع

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

الحل: المحتوى يوصل مع الصفحة (pre-rendering أو server-side rendering)، والكود الثقيل يتحمل في الصفحات الي تحتاجه بس. مكتبة الشعار ثلاثي الأبعاد عندنا مثلاً ما تنزل إلا في الصفحات الي تعرضه.

إذا المشكلة في الضغط أو الحركة مو في التحميل

INP عالي: كود كثير يشتغل وقت الضغط. ارجع للسببين 3 و4، وجرب على جوال عادي مو جوالك الجديد.

CLS عالي: صور بدون أبعاد، بانر أو إعلان ينحقن فوق المحتوى، أو تبديل الخط. احجز مكان كل عنصر قبل ما ينزل.

تحسين سرعة الموقع: الترتيب الي نمشي عليه

1. بيانات المستخدمين: أي مؤشر ضعيف وعلى أي جهاز؟ إذا الثلاثة جيدة، غالباً ما عندك مشكلة تستاهل فلوس.
2. TTFB: إذا عالي، ابدأ من الخادم والتخزين المؤقت والتحويلات.
3. أكبر عنصر: خله يبدأ ينزل مع أول ملف في الصفحة، وشيل أي شي يأخر ظهوره.
4. الصور.
5. السكربتات والإضافات: حذف أول، وبعدين تأخير.
6. الخطوط.
7. نقل الاستضافة: آخر شي، إذا TTFB ما تحسن حتى بعد التخزين المؤقت.

غيّر شي واحد كل مرة وقس بعده، وامسح التخزين المؤقت قبل القياس عشان ما تقيس النسخة القديمة. وقوقل يقول نادراً ما يغير إصلاح واحد سريع LCP بشكل ملموس، فلا تستغرب لو أول خطوة ما بان أثرها.

قبل ما تدفع لأحد يسرّع موقعك

الخدمات الي تبيعك «درجة 90» كثيرة، والدرجة ممكن ترتفع بدون ما يتغير شي عند الزائر. من الطرق المعروفة تأخير كل السكربتات لين أول حركة من المستخدم: الاختبار ما يضغط شي فالدرجة تطلع ممتازة، والزائر الحقيقي ينزل عليه الكود كله مع أول ضغطة، وهذا يبان في INP. فاطلب كتابة:

• قياس قبل وبعد لنفس الصفحات بنفس الأداة، والي يحكم هو بيانات المستخدمين بعد 28 يوم، مو درجة يوم التسليم.
• قائمة بكل تغيير انسوى، ونسخة احتياطية قبل البدء.
• فحص بعد التسليم: نموذج التواصل، السلة والدفع، زر واتساب، وأكواد التتبع.

وباقي الأسئلة الي تسألها لأي جهة تقنية جمعناها في كيف تختار شركة برمجة. وثلاث أشياء ما تستاهل فلوسك: ملاحقة درجة 100 ومؤشرات زوارك جيدة أصلاً، إعادة بناء الموقع كامل قبل ما تجرب الي فوق، وإضافات تسريع فوق بعض تتعارض.

أسئلة تتكرر عن تسريع المواقع

موقعي على ووردبريس، وش أول شي أسويه؟

إضافة تخزين مؤقت وحدة مضبوطة، وضغط الصور مع WebP. خطوتين ما تلمس التصميم. بعدها ارجع للسبب الرابع.

متجري على منصة جاهزة مثل سلة أو زد، وش بيدي؟

الخادم مو بيدك، بس الصور والقالب والتطبيقات المضافة وأكواد التتبع بيدك. احذف أي تطبيق ما تستخدمه وقس بعده.

درجة الجوال أقل بكثير من الكمبيوتر، طبيعي؟

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

درجتي عالية وزواري يشتكون، ليش؟

لأن الاختبار جهاز واحد وشبكة ثابتة، والزوار أجهزة وشبكات كثيرة. صدّق بيانات المستخدمين، وإذا ما فيه بيانات كافية جرب بنفسك على جوال عادي.

لازم أشيل بكسلات الإعلانات عشان السرعة؟

لا، خلها بس بعد المحتوى، وخذ رأي الي يدير حملاتك قبل ما تأخرها كثير، لأن التأخير الزايد ينقص الأحداث الي توصل للحملة.

التسريع يخرب شكل الموقع؟

الصور والتخزين المؤقت غالباً ما يغيرون شي. تأخير السكربتات ودمج ملفات التنسيق ممكن يكسر أشياء، فتنسوى خطوة خطوة في نسخة تجريبية مع فحص كل صفحة.

كم مرة أقيس؟

بعد كل تغيير، ومرة في الشهر، وبعد أي إضافة أو كود تتبع جديد. الصور والإضافات تبطئ الموقع تدريجياً بدون ما أحد ينتبه.

كيف نشتغل عليها

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