بقلم: أوليفر ليندبرغ
تطوير الواجهة الأمامية
14 يناير 2020
قراءة المقال: 17 دقيقة
مقدمة
يمكننا الآن إضافة المزيد من الميزات إلى مواقع الويب الخاصة بنا واستخدام المزيد من الأدوات والتقنيات من أي وقت مضى. ومع ذلك، فإن العيب في ذلك هو أن اختياراتنا يمكن أن تبطئ بشكل كبير من سرعة مواقعنا، مما يسبب إحباط العملاء (في استطلاع أجري عام 2018، قال 80 في المئة من المستخدمين إن موقع الويب الذي يستغرق وقتًا طويلاً للتحميل أكثر إحباطًا من الموقع الذي لا يعمل مؤقتًا). عندما يصبح المواقع غير قابلة للوصول أو غير مستجيبة في ظروف الشبكة البطيئة أو على الأجهزة ذات المواصفات المنخفضة، فإنه يمكن أن يستبعد العملاء المحتملين تمامًا.
1. ابنِ الموقع بالأساس للهواتف المحمولة
يصبح العملاء المحمولون أكثر انتشارًا، ونسبة العملاء الذين يستخدمون الهواتف المحمولة فقط تزداد. ومع ذلك، فإن معدلات التحويل على الهواتف المحمولة تكون أقل. يقول أندي ديفيز، خبير أداء الويب المستقل الذي عمل على موقع بائع الملابس الشهير المذكور أعلاه، إنه حان الوقت لتغيير ذلك والتعامل مع الهواتف المحمولة كمواطنين من الدرجة الأولى.
“أعطتنا تصميم الويب المستجيب القدرة على بناء مواقع يمكن أن تعمل بشكل جيد على كل من أجهزة الكمبيوتر المكتبية والهواتف المحمولة”، يشرح. “للأسف، يبدو أننا غالبًا ما نقوم بتصميم وبناء المواقع أولاً للكمبيوتر المكتبي، ثم نحاول تصغير مواقعنا لتناسب قيود الهواتف المحمولة. وهذا يؤدي إلى تجربة بطيئة وغير سلسة على الهواتف المحمولة، خاصةً للزوار الذين يستخدمون نظام Android، حيث لا تتمكن أجهزتهم غالبًا من التعامل مع كميات JavaScript ومحتوى آخر نقدمه لهم على الكمبيوتر المكتبي”.
لإنشاء تجارب سريعة للهواتف المحمولة، يوصي أندي ببناء مواقع يمكن استخدامها على هواتف Android ذات تكلفة منخفضة، مثل Alcatel 1x، ثم تعزيزها في وقت التشغيل لتقديم تجربة أكثر ثراءً للزوار ذوي الأجهزة الأقوى والشاشات الأكبر.
2. توقف عن استخدام السيارات المنزلقة والمتحركة
قد يبدو السيارات المنزلقة والمتحركة فكرة رائعة على الورق، ولكن يحذر ألكسندر لام، خبير تحسين سرعة Shopify والرئيس التنفيذي لشركة Rvere، التي تقف وراء تطبيق Shopify Hyperspeed، من أن لديهما عيبين رئيسيين يجب أن نوعِّظ عملائنا بهما.
“إنها لا تحول الزوار إلى عملاء، وتبطئ موقعك”، يحذر. “أظهرت اختبارات الاستخدام التي أجرتها مجموعة Nielsen Norman أن السيارات المنزلقة يتم تجاهلها تمامًا من قبل الزوار. وما هو أكثر من ذلك، أظهر اختبار أجري على موقع جامعة Notre Dame أن فقط 1 في المئة من الزوار نقروا على الشريحة الأولى. وكانت الشرائح الأخرى تحصل على نقرات أقل حتى”.
لا تعمل السيارات المنزلقة فقط على تحويل الزوار، بل تثقل أيضًا الموقع. يحذر ألكسندر من أن الشرائح المتحركة الفاخرة تتطلب JavaScript إضافي وغالبًا ما تتكون من عدة صور كبيرة.
“التخلص من السيارة المنزلقة يمكن أن يجعل صفحة تحميل أسرع بكثير، حيث سترى تقليلًا كبيرًا في حجم الصفحة الإجمالي”، ينصح. “افكر في وضع صورة بطل موضوعة بشكل جيد مع نداء مقنع للعمل بدلاً من السيارة المنزلقة. ستحمل بسرعة أكبر، وستحصل على المزيد من الزوار الذين ينقرون على ما ترغب فيه”.
3. قم بتحسين الصور الخاصة بك
الصور هي جزء أساسي من أي متجر إلكتروني، وغالبًا ما تشكل الجزء الأكبر منه. ومع ذلك، يمكن أن تبطئ الصور الكبيرة الموقع بشكل كبير، حيث تستغرق الصفحات الأكبر وقتًا أطول للتحميل.
إذا كنت ترغب في الاحتفاظ بجميع الصور، يوصي ألكسندر لام بضغطها على الأقل.
“قبل تحميل أي صورة إلى المتجر، قم بتشغيلها عبر مضغوط الصور المجاني مثل tinyjpg.com أو shortpixel.com”، يقترح. “هذه الخدمات ستقلل من حجم الصورة من حيث حجم البيانات، دون التضحية بالجودة أو تغيير أبعادها الفعلية. يمكن أن تصغر الصور الخام بنسبة تصل إلى 70 في المئة دون أي تغيير واضح في الجودة”.
من المهم أيضًا التأكد من استخدام الصيغة الملف الصحيحة. تكون الصور PNG مفيدة جدًا إذا كنت ترغب في وجود بكسلات شفافة في صورتك، ولكنها عادة ما تستغرق مساحة أكبر من صور JPEG.
“إذا كان لديك صورة PNG ليس لديها بكسلات شفافة، فكر في تحويلها إلى صورة JPEG قبل تحميلها”، ينصح ألكسندر. “استخدم Photoshop أو خدمة مثل PNG2JPG لتغيير تنسيق الملف الخاص بك”.
4. تحميل الصور بتأخير
توافق آنا ميجاس، متحدثة في المؤتمرات ومهندسة برمجيات في Castle، وهي شركة ناشئة تساعد الشركات على الحفاظ على حسابات عملائها عبر الإنترنت آمنة، على أن الصور هي واحدة من أكبر العوامل التي تؤثر في أداء الويب.
“يمكن أن تقول الصور أكثر من ألف كلمة، ولكنها يمكن أيضًا أن تستغرق ألف مللي ثانية أو أكثر للتحميل، والأسوأ من ذلك، أنها يمكن أن تؤخر تحميل المحتوى الآخر”، تحذر. “تخيل ما يمكن أن يحدث إذا كان موقعك يحتوي على 20 صورة وتنافس جميعها للتحميل!”
تشرح آنا أنه من الممارسات الجيدة عدم تحميل جميع الصور على الصفحة افتراضيًا، واستخدام تقنية تسمى “تحميل الصور بتأخير” بدلاً من ذلك. يعني ذلك توفير الصور فقط من الجزء العلوي من الصفحة في البداية، والبدء في جلب باقي الصور عندما يقوم المستخدم بالتمرير لأسفل ويقترب من المكان الذي يمكن العثور فيه على المزيد من الصور.
“عادةً ما يتم تنفيذ تحميل الصور بتأخير باستخدام JavaScript، ويمكنك العثور على العديد من المكتبات الصغيرة التي تساعدك على تحقيق هذا التأثير”، تنصح آنا. “المكتبات المفضلة لدي هي LazyLoad و yall.js. في Chrome، يمكن استخدام وظيفة مدمجة لتحميل الصور المحددة بواسطة إضافة الخاصية loading=”lazy” إلى علامة ، ولكنها لن تحل المشكلة بالنسبة للمتصفحات الأخرى”.
5. تحميل الخطوط الأولية مع استبدال الخطوط
في حين أن الصور تشكل جزءًا كبيرًا من جذب العملاء في متجر الكتروني، يرغب المستخدمون أيضًا في رؤية السعر ووصف المنتج بسرعة. لذلك، من المهم أن يكون النص مرئيًا في أسرع وقت ممكن، ولكنه لا يحمل بسرعة دائمًا، بسبب الخطوط الأولية.
“أحد الأسباب التي قد تجعل النص غير مرئي هو استخدام خطوط خارجية غير مدعومة بشكل افتراضي على جهاز المستخدم”، توضح آنا ميجاس. “في هذه الحالة، يحتاج الموقع إلى تحميل الخطوط أولاً قبل أن يتم عرضها على الشاشة. قد يستغرق ذلك بعض الوقت، ومن الجيد أن توفر خطًا بديلًا يظهر بدون أي تأخير ثم يتم استبداله بالخط المطلوب”.
للقيام بذلك، تقترح آنا إما إضافة خاصية font-display: swap في تعريف @font-face الخاص بك، أو إذا كنت تستخدم Google Fonts، يمكنك إضافة معلمة URL عرض= “swap” (على سبيل المثال: ).
6. إنشاء رسوم متحركة سلسة
الرسوم المتحركة – عندما يتم إنجازها بشكل صحيح – تحسن تجربة المستخدم بشكل سلس وغير ملحوظ على موقع الويب. ولكن عندما يتم إنجازها بشكل خاطئ، يمكن أن تشتت وتشتت انتباه الزوار.
يوصي تايلر تشايلدز، كبير مهندسي البرمجيات في Netflix، ببعض التقنيات لتحسين الرسوم المتحركة التي تم إنشاؤها باستخدام CSS أو JavaScript. CSS
“هناك سر صغير لتحقيق رسوم متحركة سلسة باستخدام CSS، وهو استخدام الخصائص التي لا تجبر تغيير تخطيطك أو إعادة رسم البكسلات”، يشرح تايلر. “القاعدة العامة هي استخدام الشفافية والتحويل فقط، ولكن إذا كنت ترغب في المزيد، فتحقق من CSS Triggers”.
تؤثر الشفافية والتحويل فقط على المحتوى الذي يتم تنسيقه. يبقى المحتوى المنسق في مكانه بالنسبة لبقية الصفحة، وكما يوضح تايلر، ستحدث السحر للمستخدم:
7. تقليل تأثير الأطراف الثالثة
مع وتيرة التطور المتزايدة في التجارة الإلكترونية، لا يمكن للشركات بناء كل شيء داخليًا، لذلك طبيعي أن نعتمد على خدمات الأطراف الثالثة لدعمنا.
ومع ذلك، فإن العديد من هذه الخدمات تركز على تسهيل تجربة المستخدم، وليس على جودة التنفيذ، مما يؤدي في كثير من الأحيان إلى تدهور الأداء، حسبما يحذر خبير أداء الويب رايان تاونزند.
“توصيتي الأولى هي تحرير أكبر قدر ممكن من مسار العرض الحرج”، ينصح. “ضمان أن موقعك يظهر بسرعة يقلل من معدل الارتداد للزوار الذين تعبوا للوصول إليه، لذا انتبه لأي نصوص متزامنة أو ورقات أنماط أو خطوط تحملها من الأطراف الثالثة داخل علامة
. حتى إذا قمت بإجراء تغييرات طفيفة فقط، يمكن أن يكون لذلك تأثير هائل – أحد عملائي قلص وقت الرسم الأول المعنوي بثلث على اتصالات 3G ببساطة عن طريق تغيير علامة نص واحدة إلى غير متزامنة!”حل مشكلة أوقات الرسم هو خطوة واحدة فقط للتعامل مع الأداء. خطوة أخرى هي تنفيذ البرامج النصية بشكل صحيح، والتي يصفها رايان بأنها عائق كبير للويب اليوم.
“نصيحتي هنا هي التفكير في الوقت الذي تحتاج فيه إلى تنزيل وتنفيذ البرنامج النصي من الطرف الثالث”، يوصي. “قلصت أحد عملائي 40 في المئة من وقت تنفيذ وحدة المعالجة المركزية المانعة للتنفيذ على أجهزة الجوال ذات المواصفات المنخفضة عن طريق تحميل خدمة مراجعات العملاء الخاصة بهم عندما يقوم الزوار بتوسيع علامة التعليقات على صفحات المنتجات، بدلاً من تحميلها على كل صفحة بغض النظر عن ذلك”.
تقترح رايان أن هذه التقنية تعمل عادةً بشكل جيد مع الدردشة المباشرة: بدلاً من أن تظهر على كل صفحة، فكر في توفير زر داخل وصفات المنتج أو الأسئلة المتداولة التي تحملها عندما يشير الزائر إلى رغبته في الدردشة.
8. الاتصال المسبق بنطاقات الأطراف الثالثة الرئيسية
تقوم المتصفحات بعمل رائع في اكتشاف وتنزيل المحتوى بترتيب يجعل صفحاتنا أسرع، ولكن في بعض الأحيان يحتاجون إلى بعض المساعدة، كما يشير أندي ديفيز، خبير أداء الويب المستقل.
“بعض الموارد يتم اكتشافها في وقت متأخر”، يوضح. “الخطوط والصور الخلفية لا يتم اكتشافها إلا عندما يبدأ المتصفح في تطبيق الأنماط على الصفحة، وقد تعتمد الموارد الأخرى على البرنامج النصي لإدراجها – مثل Google Analytics أو Tag Manager، على سبيل المثال. إذا كانت هذه الموارد مستضافة على نطاق الطرف الثالث، فسيكون هناك تأخير أثناء إنشاء اتصال جديد وتأمينه”.
يوصي أندي باستخدام تلميح المورد المسبق Preconnect، والذي يمكن أن يساعد في التغلب على هذا التأخير عن طريق اقتراح تسخين المتصفح اتصالًا جديدًا بنطاق الطرف الثالث.
على سبيل المثال، إذا كانت الموارد مستضافة على example.com:
<link rel=”preconnect” href=”example.com”>
يجب إضافة السمة crossorigin إذا تم جلب الخطوط من example.com:
<link rel=”preconnect” href=”example.com” crossorigin>
قد يكون تحسين واحد للاتصال المسبق كافيًا في بعض الأحيان، ولكن ينصح أندي بأنه قد تحتاج إلى تجربة لمعرفة ما يعمل بشكل أفضل لموقعك.
9. التحكم في التطبيقات الخارجية
يمكن أن تؤثر التطبيقات الخارجية أيضًا بشكل كبير عند استخدام قوالب Shopify. بغض النظر عن الوقت والجهد الذي تبذله لتحسين قالبك، يمكن أن يتم التراجع عنه في خمس دقائق سريعة على متجر Shopify، حسبما يحذر جافين بالارد، مؤسس والرئيس التنفيذي لشركة Disco، وهي شريكة Shopify Plus.
“المجموعة الواسعة من التطبيقات الخارجية المتاحة هي أحد نقاط قوة Shopify”، يشرح. “ولكن العديد من مطوري التطبيقات لا يضعون أداء القالب في الاعتبار – وحتى أولئك الذين يفعلون ذلك يجب أن يبنوا تطبيقاتهم للعمل مع أكثر من مليون متجر إلكتروني عبر منصة Shopify، وليس فقط متجر العميل الخاص بك”.
لتقليل تأثير الأداء على متجر Shopify، هناك خطوتان يوصي جافين بالارد بهما. هل تحتاج إلى تطبيق؟
أولاً، قم بالتفكير في ما إذا كنت فعلاً بحاجة إلى تطبيق في المقام الأول.
“العديد من تطبيقات متجر Shopify متاحة للتجار بدون أي مهارات HTML/CSS/JavaScript، وهم يرغبون فقط في حل مشكلة ما بنقرة واحدة”، يشير جافين. “يمكن بناء أشياء مثل مؤقتات العد التنازلي، وأشرطة الإعلان، أو نوافذ الخروج داخل القالب باستخدام لا شيء أكثر من رشة خفيفة من Liquid و CSS و JavaScript. بناء هذه الميزات مباشرة في القالب يمنحك مزيدًا من السيطرة على تأثير الأداء (على سبيل المثال، تجنب تحميل 30 إصدارًا من jQuery) ويتيح لك تطبيق التقنيات الأخرى المناقشة هنا وفي أماكن أخرى على الويب لتحسين توصيل الكود الخاص بك إلى المستعرض”. هل يمنحك التطبيق السيطرة؟
ثانيًا، إذا قررت أنك فعلاً بحاجة إلى تطبيق لدعم الوظائف التي تحتاجها، فاستكشف ما إذا كان التطبيق يمنحك السيطرة على كيفية تفاعله مع قالبك.
“على سبيل المثال، يوفر تطبيق Back in Stock الشهير للعملاء القدرة على التسجيل للحصول على إشعارات عبر البريد الإلكتروني والرسائل القصيرة عندما يعود المنتج إلى المخزون – شيء لا يمكن تحقيقه من خلال القالب وحده”، يوضح جافين. “ومع ذلك، يوفر لمطوري الواجهة الأمامية مجموعة من الخيارات فيما يتعلق بكيفية دمج وظائفه في قالب Shopify – سواء عن طريق مثبت تلقائي، أو من خلال قطعة Liquid يمكن نسخها ولصقها، أو عن طريق بناء تكامل مخصص تمامًا باستخدام واجهة برمجة التطبيقات الخاصة بهم”.
10. رصد عدد الطلبات لكل نطاق فرعي
لقد تطورت المتصفحات بشكل كبير منذ أن بدأت إيميلي ناكاشيما، مديرة الهندسة في Honeycomb.io، في كتابة الكود للويب في أوائل الألفية الجديدة، ولكن بالنسبة لأولئك منا الذين لا يزالون بحاجة إلى دعم http 1.1، لا يزال هناك شيء واحد لم يتغير – لا يزال هناك حد لعدد الطلبات المتزامنة التي سيقوم المتصفح بإجرائها إلى أي نطاق فرعي واحد، وعادة ما يكون ستة.
“الهدف من هذا الحد هو منع إطلاق هجوم DOS عن طريق الخطأ على خادم ويب صغير لطيف في أي مكان عندما تحاول تحميل صفحة كتالوج كاملة من الصور أو موارد أخرى دفعة واحدة”، توضح إيميلي. “ولكن في الويب الحالي، حيث يستخدم العديد منا خدمات سحابية قابلة للتوسع بشكل كبير ويخدمون صورهم من CDN، قد يبطئ الحد تجربتك بشكل غير ضروري”.
للتغلب على ذلك، توصي إيميلي بتقنية تعرف باسم تجزئة النطاق Domain Sharding، والتي تقوم بتحميل مجموعة من الموارد من عدة نطاقات أو نطاقات فرعية لزيادة عدد الطلبات المتزامنة. على سبيل المثال، يمكنك استخدام عدة نطاقات فرعية (cdn1.example.com، cdn2.example.com، إلخ) مع نفس CDN الخاص بك لتمكين تحميل المزيد من الصور في وقت واحد. ولكن هناك بعض التكاليف المرتبطة باستخدام عدة نطاقات – ستحتاج إلى إجراء طلب DNS آخر لكل نطاق جديد قبل أن تتمكن من بدء تنزيل المورد الخاص بك.
إذا كنت ترغب في معرفة ما إذا كانت تجزئة النطاق مكونة بشكل مثالي، أو إذا كنت بحاجة إلى إضافة المزيد، فقم بتحليل عدد الطلبات المتزامنة لكل نطاق.
“عندما تنظر إلى تتبع الأداء الموزع على الجانب العميل أو شلال الشبكة في أدوات تطوير المتصفح، انظر إلى نمط الطلبات”، تنصح إيميلي. “إذا كان شلال الماء ضيقًا نسبيًا، وتحدث الطلبات بشكل متزامن بشكل أساسي، فمن المرجح أن لديك عدد كافٍ من الأجزاء. إذا رأيت كتل متسلسلة من الطلبات إلى نفس النطاق في نمط السلم، فمن المرجح أن تحتاج إلى تكوين المزيد من الأجزاء”.
11. استخدم ميزانيات الأداء
بالنسبة للعديد من المطورين، تحسين الأداء هو واحدة من أكثر أنواع الهندسة المثيرة للاهتمام، لذلك من السهل أن تنخرط في العمل الذي قد لا يكون مهمًا للعملاء الخاص بك. لذلك، يوصي إيميلي ناكاشيما بالتأكد من أنك تقوم بتحسين ما يهم حقًا.
“في Honeycomb، نحن معجبون كبار بنهج Service Level Objective (SLO) لمنع التحسينات الغير ضرورية”، تكشف. “عند استخدام SLOs، تقوم بتعيين أهداف مسبقة لأداء وموثوقية موقعك استنادًا إلى توقعات وتحملات عملائك (على سبيل المثال، ‘عملاءي يستخدمون موقعنا طوال اليوم في العمل، لذا يحتاجون إلى أن يكون سريعًا – يجب أن تكتمل طلبات الصفحة الرئيسية في غضون ثانية واحدة’).”
“تقوم أيضًا بتحديد ميزانية لكمية الوقت التي يمكنك فيها تجاوز الهدف (على سبيل المثال، ‘يجب أن يكون وقت الاستجابة في النسبة المئوية 95 أقل من ثانية واحدة، 99.9٪ من الوقت’). عندما تكون فوق الميزانية، فهذا هو إشارتك لقضاء الوقت في تحسين الأشياء التي ستجعلك تنخفض تحت الميزانية، حتى تتمكن من التأكد من أنك تعمل على ما يهم العملاء أكثر. في بقية الوقت، يمكنك أن تشعر بالرضا عن العمل غير الأداء، مثل الاستثمار في ميزات جديدة أو تنظيف الديون التقنية”.
في عالم أداء الويب، تعد ميزانيات الأداء نوعًا محددًا من SLO تهدف إلى التأكد من أن موقعك يتم تحميله بسرعة. هناك العديد من الأدوات الرائعة التي تجعل تتبع ميزانيات الأداء أسهل من تتبع SLO المتوسط.
في Honeycomb، حيث تعمل إيميلي على أداة تطوير فعلية في الوقت الحقيقي تساعد مهندسي البرمجيات على فهم ما يحدث في أنظمتهم الإنتاجية، يقوم الفريق بقياس ميزانيتهم الأداء من خلال تتبع أوقات تحميل الصفحة في الإنتاج. وبالنسبة للفرق التي لا تستخدم بشكل كبير بيانات رصد المستخدم الفعلي (RUM)، تقول إيميلي إن أسهل طريقة لتتبع وفرض ميزانية الأداء هي من خلال بناءها في أدوات البناء الخاصة بهم (على سبيل المثال، webpack) والتأكد من أن HTML و CSS و JavaScript الخاصة بهم محدودة إلى حجم ملف وعدد ملفات معين.
تحقق من أداة تدقيق Google Lighthouse ومستندات MDN Web Docs، حيث تقدم كلاهما اقتراحات جيدة حول كيفية إعداد ميزانية الأداء الخاصة بك.
اجمع كل شيء معًا
كما أظهرت نصائح خبرائنا، تظل الصور والخدمات الأطراف الثالثة هما أحد الأسباب الرئيسية لبطء الموقع. قم بتخصيص الوقت والموارد لتحسين الصور وتقليل تأثير الأطراف الثالثة قدر الإمكان، ومن المحتمل أن تحقق فرقًا كبيرًا في أداء الموقع الذي تعمل عليه. تخلص أيضًا من السيارات المنزلقة وقم بتحسين الخطوط والرسوم المتحركة، وستوفر المزيد من الثواني.
اجمع ذلك مع نهج يركز على الهواتف المحمولة وميزانية الأداء، وسيكون لديك استراتيجية قوية لأداء الويب تسعد عملائك وعملاءهم على حد سواء. الآن، قم بتسريع هذا الموقع!
أفضل نصائحك لتحسين أداء الويب؟
شاركها في التعليقات أدناه!
أسئلة شائعة حول أداء الويب
ما معنى أداء الويب؟
أداء الويب هو قياس مدى سرعة وكفاءة تحميل واستجابة وسلوك موقع الويب للمستخدمين في بيئة معينة. يشمل عوامل مثل سرعة الصفحة، وأوقات التحميل، وأوقات استجابة الخادم، وغيرها. يعد أداء الويب مهمًا لأنه يمكن أن يؤثر على تجربة المستخدم، وتصنيفات محركات البحث، ونجاح الموقع الإلكتروني بشكل عام.
ما هو أداء الويب الجيد؟
يتم تعريف أداء الويب الجيد على أنه مزيج من السرعة والموثوقية والاستخدامية. السرعة مهمة لتوفير تجربة مستخدم جيدة، حيث يميل المستخدمون إلى التخلي عن المواقع التي تستغرق وقتًا طويلاً للتحميل. الاستقرار مهم لضمان أن الموقع متاح ويعمل بشكل صحيح دائمًا. الاستخدامية مهمة لضمان أن يمكن للمستخدمين التفاعل بسهولة مع الموقع والعثور على ما يبحثون عنه.
كيف يمكنني تحسين أداء الويب؟
يمكنك تحسين أداء الويب عن طريق استخدام شبكة توزيع المحتوى (CDN)، وتقليل طلبات HTTP، وتمكين التخزين المؤقت في المتصفح، وتحسين الصور، وتقليل حجم HTML و CSS و JavaScript، وتقليل وقت استجابة الخادم، وا
Source: https://shopify.com/partners/blog/web-performance
اترك تعليقاً