زيادة سرعة متاجر سلة

السلام عليكم ورحمة الله وبركاته،تحية طيبة لفريق الدعم الفني،نحن متجر Daily Cares، ونعمل على منصة سلة باستخدام قالب سيليا.خلال مراجعة الأداء الفني للمتجر باستخدام أداة Google PageSpeed Insights، رصدنا عددًا من المشكلات التي تؤثر على سرعة صفحات المنتجات واستقرارها وتجربة المستخدم، خصوصًا على أجهزة الجوال.ونظرًا لأهمية صفحات المنتجات في إتمام عمليات الشراء، نرجو منكم مراجعة النتائج التالية وتحديد أسبابها ومعالجتها بالتنسيق مع الجهة الفنية المسؤولة.بيانات الصفحة محل الفحص:

• المتجر: https://dailycares.co

• صفحة المنتج: https://dailycares.co/krkar-hair-cream/p2070069298

• نوع الفحص: الجوال (Mobile)

• الأداة: Google PageSpeed Insights

• نتيجة الأداء في أحد الفحوص: 39/100، مع تسجيل نتائج أعلى في فحوص أخرى.

أولًا: ارتفاع وقت تنفيذ JavaScript واستهلاك المعالجأظهرت نتائج الفحص المؤشرات التالية:

• وقت عمل المعالج الرئيسي: 7.2 ثانية.

• وقت تقييم وتنفيذ JavaScript: نحو 3.5 ثانية.

• تحليل وتجميع JavaScript: ‏531 مللي ثانية.

• معالجة التخطيط والتنسيق: ‏955 مللي ثانية.

• تسجيل 17 مهمة طويلة على المعالج.

كما أظهر تحليل مصادر وقت المعالج النتائج التالية:

• Salla Network: ‏2,395 مللي ثانية.

• dailycares.co: ‏1,017 مللي ثانية.

• Google Tag Manager: ‏942 مللي ثانية.

نرجو مراجعة السكربتات والمكونات المسؤولة عن هذا الاستهلاك، والتحقق من إمكانية تقليل المهام طويلة التنفيذ وتأجيل السكربتات غير الضرورية أثناء العرض الأولي، مع التأكد من عدم وجود تحميل أو تنفيذ مكرر.ثانيًا: عدم استقرار تخطيط صفحة المنتج (CLS)سجل الفحص قيمة CLS = 0.164، وحدد منطقة تفاصيل المنتج بوصفها العنصر الأكثر تأثرًا بتحركات التخطيط:div.container--product-detailsوقد ارتبط بهذا العنصر مقدار تحرك يبلغ نحو 0.160.نرجو فحص أسباب تغير موضع تفاصيل المنتج أثناء التحميل، بما في ذلك معرض الصور، والمساحات المحجوزة للمكونات، وتحميل الخطوط والعناصر الديناميكية.الهدف هو تثبيت تخطيط الصفحة ومنع تحرك المحتوى أو أزرار الشراء بصورة مفاجئة أثناء التصفح.ثالثًا: الموارد التي تعيق العرض الأولي (Render-Blocking Resources)رصد التقرير فرصة لتحسين زمن العرض بنحو 470 مللي ثانية، مع ظهور الملفات التالية ضمن الموارد المانعة للعرض:

• product-details.css من خوادم سلة.

• app.css من خوادم سلة.

• rocket-loader.min.js من Cloudflare.

نرجو مراجعة طريقة تحميل ملفات CSS وإمكانية تحسين مسار العرض الأولي وتقليل الأنماط غير المستخدمة دون الإضرار بتنسيق الصفحة.كما نود الإشارة إلى أن خاصية Rocket Loader معطلة حاليًا من إعدادات Cloudflare، ومع ذلك ظهر ملفها في التقرير؛ لذا نرجو التحقق من سبب طلبه وما إذا كان يؤثر على الأداء.رابعًا: تحسين تحميل الصور وأحجامهاحدد PageSpeed فرصة لتوفير نحو 243 KiB من نقل الصور.وتشمل النتائج الصورة الرئيسية للمنتج وصور المنتجات المقترحة المعروضة أسفل الصفحة.لاحظنا أن بعض الصور تُحمّل بأبعاد أكبر من المساحة المستخدمة لعرضها، مثل صور بأبعاد 500×500 أو 1000×1000 بكسل.نرجو مراجعة ما يلي:

• استخدام الصور المتجاوبة srcset وsizes عند الحاجة.

• تقديم نسخ مناسبة لأبعاد بطاقات المنتجات.

• التحقق من التحميل الكسول Lazy Loading للصور الموجودة أسفل منطقة العرض الأولى.

• المحافظة على جودة الصورة الرئيسية للمنتج وإمكانية تكبيرها.

ونؤكد أننا لا نرغب في حذف المنتجات المقترحة أو تقليل جودة الصور الأساسية، وإنما تحسين آلية تحميلها.خامسًا: مراجعة ملفات تمارا والتخزين المؤقترصد PageSpeed فرصة لتحسين التخزين المؤقت للموارد الخارجية بنحو 906 KiB.ومن أبرز النتائج تحميل موارد من نطاق تمارا cdn.tamara.co بحجم إجمالي يقارب 1,110 KiB، من بينها:

• ملف شعار SVG بحجم يقارب 747 KiB.

• ملفات خطوط بحجم 131 KiB و123 KiB.

• مدة تخزين مؤقت تبلغ 4 ساعات لعدد من هذه الموارد.

نرجو مراجعة تكامل تمارا والتحقق من إمكانية تقليل أحجام الملفات غير الضرورية، وتحسين توقيت تحميل المكونات الترويجية الخاصة بالدفع بالتقسيط، والتنسيق مع مزود الخدمة عند الحاجة.ونؤكد ضرورة المحافظة على عمل وسائل الدفع بالتقسيط وعدم تعطيلها أثناء تنفيذ التحسينات.سادسًا: ملاحظات إمكانية الوصول وبنية عناصر الصفحةرصد PageSpeed ملاحظات تتعلق ببنية عناصر معرض الصور، ومنها:ARIA role should be appropriate for the elementوظهرت الملاحظة على عناصر ضمن معرض صور المنتجات تستخدم أصنافًا مثل:swiper-slideكما ظهرت في إحدى صفحات المنتجات ملاحظة تتعلق بعناصر اختيار لا تحمل تسميات مناسبة:Form elements must have labelsنرجو مراجعة استخدام خصائص ARIA والتسميات البرمجية لعناصر الاختيار ومعرض الصور، لضمان توافقها مع معايير إمكانية الوصول، دون التأثير على وظائف معرض الصور أو خيارات الشراء.سابعًا: مراجعة تأخر عرض الصورة الرئيسية (LCP)أظهر تحليل أكبر عنصر مرئي أن الصورة الرئيسية لكريم الكركار تستخدم بالفعل:

• fetchpriority="high"

• loading="eager"

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

1. فحص المشكلات المذكورة وتحديد أسبابها الفعلية.

2. توضيح أي المشكلات تتبع منصة سلة، وأيها يتعلق بقالب سيليا أو التطبيقات الخارجية.

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

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

5. إعادة اختبار صفحة المنتج بعد تنفيذ الإصلاحات ومقارنة النتائج.

6. إفادتنا بما يمكن إصلاحه، وما يتطلب تحديثًا من المنصة أو القالب، وما لا يمكن التحكم فيه حاليًا.

ملاحظة مهمة:المتجر يعمل حاليًا ويستقبل طلبات العملاء، ولذلك نرجو عدم إجراء تعديلات قد تؤثر على التصميم أو السلة أو الدفع أو تتبع التحويلات الإعلانية دون التحقق من سلامتها واختبارها.كما نرجو المحافظة على توافق التحسينات مع تحديثات سلة وقالب سيليا المستقبلية.سوف نرفق صورًا من نتائج Google PageSpeed Insights توضح المشكلات المذكورة.نتطلع إلى معالجة تقنية فعلية تساهم في تحسين سرعة المتجر وتجربة العملاء، ونرجو تزويدنا برقم تذكرة المتابعة وإفادتنا بنتائج الفحص والإجراءات المقترحة.شاكرين لكم تعاونكم واهتمامكم.فريق Daily Cares
https://dailycares.co