تاريخ النشر: 24 يونيو 2026
Nuvemshop (المعروفة باسم Tiendanube في أمريكا اللاتينية الناطقة بالإسبانية) هي منصة التجارة الإلكترونية الرائدة في المنطقة، وتدير أكثر من 180,000 متجر على الإنترنت. بما أنّ التجّار يخصّصون واجهات متاجرهم من خلال مظاهر متعددة وترتيبات محتوى ديناميكية، فإنّ ضمان تحميل الصفحات بسرعة في ظل هذا التنوع يمثّل تحديات فنية فريدة.
- تحسّنت صحة مقياس "سرعة عرض أكبر محتوى مرئي" (LCP) بنسبة %68، من %57 إلى %96 في عام واحد، ما يعكس تغييرًا كبيرًا في كيفية عرض المتاجر للمحتوى في أعلى إطار العرض للمستخدمين الحقيقيين.
- ارتفع معدّل اجتياز Core Web Vitals من %48 إلى %72، ما يعني أنّ ما يقرب من 3 من كل 4 متاجر تستوفي الآن الحدّ الأدنى من الأداء المطلوب من Google.
- تحسُّن ملحوظ في التفاعل مع ميزات التسوّق: من خلال تحليل المجموعة نفسها من المتاجر البرازيلية النشطة في يناير 2025 ويناير 2026، أظهر الزوّار من الأجهزة الجوّالة عبر نتائج البحث المجاني من Google ما يلي:
- زيادة بنسبة %8.9 في معدّل الإحالات الناجحة (من الجلسة إلى الطلب المدفوع)
- زيادة بنسبة %8.4 في معدّل التفاعل مع سلة التسوّق (من الجلسة إلى سلة التسوّق)
- حقّقت الأجهزة الجوّالة أكبر المكاسب، بما يتوافق مع التحسينات الأكثر أهمية في مقياس LCP.
تتوافق هذه النتائج مع بحث Deloitte الذي أجرته Google (أكثر من 30 مليون جلسة على مستوى 37 علامة تجارية)، والذي وجد أنّ تحسين سرعة التحميل بمقدار 0.1 ثانية يمكن أن يزيد من معدلات الإحالات الناجحة للبيع بالتجزئة بنسبة %8.4، ما يؤكد صحة اتجاه استثماراتنا.
التحدي: رصد مقياس LCP في تنسيقات التجارة الإلكترونية الديناميكية
في بداية عام 2025، اجتاز %48 فقط من متاجرنا حدود Core Web Vitals، وحصل %57 منها على نتائج جيدة في مقياس سرعة عرض أكبر محتوى مرئي (LCP). كانت فرضيتنا الأولية هي حجم الصورة أو وقت استجابة الخادم. لقد أخطأنا.
من خلال تحليل أداة إحصاءات PageSpeed لآلاف المتاجر، اكتشفنا أنّ منصتنا تتيح للتجّار ترتيب أقسام الصفحة الرئيسية بشكل ديناميكي، إذ يمكن أن تظهر لوحات العرض الدوّارة واللافتات وشبكات المنتجات والوحدات المخصّصة بأي ترتيب.
أدت هذه المرونة إلى ظهور مشكلة غير متوقعة: لم يتم دائمًا تحديد العنصر الصحيح على أنّه سرعة عرض أكبر محتوى مرئي (LCP). في المتاجر التي تحتوي على لوحات عرض دوّارة، والتي تمثّل %85 من واجهات المتاجر، كان يتم أحيانًا وضع علامة على بانر في أسفل إطار العرض على أنّه LCP بدلاً من صورة لوحة العرض الدوّارة الأولى، وذلك استنادًا إلى كيفية عرض الصفحة على الشاشات والأجهزة المختلفة. وهذا يعني أنّ جهودنا لتحسين الأداء لم تحقّق التأثير المطلوب، لأنّنا كنّا نحسّن عناصر لم تكن في الواقع عناصر LCP.
على عكس منصات SaaS العادية، لم نتمكّن من إصلاح الصفحة الرئيسية فقط. كنا بحاجة إلى حلّ يعمل مع كل الإعدادات الممكنة للمظاهر وترتيبات الأقسام وتخصيصات التجّار، بدون التأثير في المتاجر الحالية أو الحدّ من الحرية الإبداعية.
كيف تؤثر التنسيقات الديناميكية في اختيار عنصر LCP
من خلال تحليل "إحصاءات PageSpeed" ومراقبة المستخدمين الفعليين، اكتشفنا أنّ انتقالات CSS في لوحات العرض الدوّارة وإعلانات البانر تأخرت عندما أصبحت العناصر مرئية لخوارزمية رصد LCP في المتصفّح. على الرغم من أنّ المستخدمين لاحظوا أنّ لوحة العرض الدوّارة يتم تحميلها أولاً، وضع المتصفّح أحيانًا علامة على بانر في القسم الثاني على أنّه عنصر LCP، لأنّ ظهور هذا العنصر لم يتأخر بسبب تأثيرات الانتقال.
وقد حدّدنا ثلاثة أسباب أساسية:
- تم تأخير انتقالات CSS عندما تم اعتبار العناصر مرئية، مما دفع اكتشاف LCP إلى الإطار الخطأ.
- تم تطبيق التحميل الكسول على الصور في أعلى إطار العرض التي كان من المفترض تحميلها على الفور.
- أدّى عدم توفّر إشارات الأولوية إلى عدم تحميل الصور الأكثر أهمية أولاً.
وجدنا أيضًا أنّ جزءًا كبيرًا من قياسات LCP جاء من صفحات الفئات والمنتجات، وليس فقط من الصفحات الرئيسية، ما يعني أنّ الإصلاحات التي أجريناها يجب أن تُطبَّق بشكل متّسق على جميع أنواع الصفحات التي تشهد عددًا كبيرًا من الزيارات.
التنفيذ: إصلاح الأسباب الأساسية الثلاثة على نطاق واسع
بعد تحديد الأسباب، كانت الإصلاحات واضحة. وقد طبّقناها بشكل متّسق على جميع المواضيع الأساسية وأنواع الصفحات، ولكن تطلّب كل منها تحديدًا دقيقًا للنطاق لتجنّب حدوث مشاكل جديدة.
- تمت إزالة انتقالات CSS للأقسام في الموضع الأول. فالأقسام التي تظهر أولاً على الصفحة يتم عرضها الآن على الفور، ما يضمن أن يرصدها المتصفّح كعناصر مرشحة لتكون أكبر محتوى مرئي (LCP) بدون أي تأخير اصطناعي.
تمت إزالة التحميل الكسول من الصور في أعلى إطار العرض. بالنسبة إلى الصور في القسم الأول، نزيل السمة
loading="lazy"بشكل مشروط لتجنُّب تأخير تحميل الموارد. حرصنا على تطبيق هذا التغيير على الصورة الأولى فقط في الأقسام التي تظهر في الموضع الأول:<!-- Before --> <img src="slide-1.webp" loading="lazy" al>t<="Featu>r<ed product" !-- After -- img src="s>lide-1.webp" alt="Featured product"تمت إضافة إشارات واضحة للأولوية. من خلال إضافة
fetchpriority="high"، نُعلم الماسح الضوئي للتحميل المُسبق في المتصفّح بأنّ صورة مقياس LCP هي مورد ذو أولوية قصوى، ما يتيح اكتشافها وتنزيلها في وقت أقرب، قبل انتهاء التنسيق والعرض. أضفنا منطق التحقّق لضمان تطبيق إشارات الأولوية فقط عندما يكون العنصر في موضع يمكن أن يكون فيه مرشحًا لـ LCP: إضافةfetchpriority="high"إلى عدد كبير جدًا من الصور ستؤدي إلى نتائج عكسية، لأنه إذا كان كل شيء ذو أولوية عالية، فلن يكون هناك شيء ذو أولوية.<!-- Before --> <img src="slide-1.webp" alt="Fe>a<tured produc>t<" !-- After -- img src="slide-1.webp" fetchpriority>="high" alt="Featured product"تقليل وقت الاستجابة من خلال التخزين المؤقت على الحافة: يُعدّ التخزين المؤقت فعّالاً في تقليل أوقات التحميل، ولكن في التجارة الإلكترونية، ينطوي على مخاطر حقيقية، إذ إنّ عرض بيانات قديمة عن الأسعار والمستودع يؤثر بشكل مباشر في ثقة العملاء والإيرادات. وقد تعاملنا مع هذا الأمر بحذر من خلال مراقبة مقاييس النشاط التجاري إلى جانب بيانات الأداء، وزيادة معدلات نتيجة ذاكرة التخزين المؤقت إلى أقصى حد مع ضمان عدم تخزين أي محتوى مؤقتًا قد يضر بتجربة التاجر أو المشتري.
التأثير والنتائج: تحسُّن في مقياس LCP بنسبة تتراوح بين %57 و%96
| المقياس (من يناير 2025 إلى يناير 2026) | التحسّن النسبي |
|---|---|
| سرعة عرض أكبر محتوى مرئي (جيدة) | +68% (من %57 إلى %96) |
| مؤشرات Core Web Vitals (معدّل النجاح) | +50% (من %48 إلى %72) |
| معدّل الإحالات الناجحة (من الجلسة إلى الطلب المدفوع) — نتائج البحث المجاني من Google على الأجهزة الجوّالة | +8.9% |
| التفاعل مع سلة التسوّق (من الجلسة إلى سلة التسوّق) - نتائج البحث المجاني على Google للأجهزة الجوّالة | +8.4% |
بفضل هذه التحسينات، أصبحت Nuvemshop وTiendanube المنصّتين الأفضل أداءً في مجال التجارة الإلكترونية في البرازيل والأرجنتين والمكسيك.
النقاط الرئيسية المستخلصة والأفكار اللاحقة
بسبب بنية Nuvemshop القابلة للتخصيص بشكل كبير، لم نتمكّن من الاعتماد على أدلة التحسين العادية. لم تكن المشكلة الحقيقية في حجم الصورة أو وقت استجابة الخادم، بل كانت في اختيار المتصفحات لعناصر غير متوقعة كمقياس LCP بسبب تأثيرات CSS الانتقالية، وغياب إشارات الأولوية، وتطبيق ميزة التحميل الكسول على الصور في أعلى إطار العرض.
كان الحلّ بسيطًا بعد أن فهمنا الأسباب الأساسية: إزالة الانتقالات من الأقسام في الموضع الأول، وإزالة التحميل الكسول من الصور في أعلى إطار العرض، وإضافة إشارات أولوية واضحة. وقد طبّقنا هذا الإجراء بشكل متّسق على جميع المظاهر الأساسية وأنواع الصفحات وأكثر من 180,000 متجر على منصتنا.
النتائج تتحدث عن نفسها: ارتفعت معدلات اجتياز سرعة عرض أكبر محتوى مرئي (LCP) من %57 إلى %96، وارتفعت معدلات اجتياز Core Web Vitals بشكل عام من %48 إلى %72، وحقق التجار مكاسب قابلة للقياس: زيادة بنسبة %8.9 في معدل الإحالات الناجحة وزيادة بنسبة %8.4 في التفاعل مع سلة التسوق على الأجهزة الجوّالة. واجهات المحلات السريعة ليست مجرد إنجاز تقني، بل إنّها تساهم بشكل مباشر في نجاح التجّار.