تحسين أداء موقع الويب صفحة بصفحة

اختر الرحلات للقياس

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

القياسات المختبرية المنفصلة ، التي تساعد في إعادة إنتاج مشكلة ، من البيانات الميدانية المتاحة ، والتي تصف تجربة الزائر الحقيقية. إذا كانت حركة المرور منخفضة للغاية بالنسبة لمقياس مستقر ، فلا تقدم درجة واحدة كاتجاه. Web.dev يشرح أدوات القياس واستخداماتها.

• الصفحات والأجهزة المختارة.
• خط الأساس القابل للتكرار.
• المهمة التي يحتاجها الزائر لإكمالها.

ابحث عن سبب بطء التحميل

حدد العنصر الرئيسي المرئي أثناء التحميل والمورد الذي يوفره. يمكن أن تؤدي صورة البطل كبيرة الحجم أو الطلب المتأخر أو الاعتماد على البرنامج النصي إلى تأخير LCP. استخدام صورة مناسبة لحجمها المعروض ، مع أبعاد HTML والمتغيرات سريعة الاستجابة والأولوية المعقولة ؛ لا تؤجل الصورة الرئيسية بدون سبب.

ثم افحص الخطوط و CSS و JavaScript واستجابات الخادم. قم بإزالة الموارد غير المستخدمة حقًا وتجنب تنزيل كل بطاقة خارج الشاشة على الفور. ال دليل الصور يغطي الإعداد البصري والبدائل.

منع التحولات والحفاظ على التفاعلات

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

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

ضع ميزانية وتحقق بعد الإصدار

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

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

• بايت وتأخيرات قبل وبعد.
• لا يوجد انحدار بصري أو وظيفي.
• التحقق من الصفحات والأجهزة ذات الأولوية.