يُعدّ أداء الويب جانبًا مهمًا من مراحل تطوير الويب يركّز على سرعة تحميل الصفحات، بالإضافة إلى مدى استجابتها لإدخالات المستخدمين. فعند تحسين موقعك على الويب لتحسين الأداء، تمنح المستخدمين تجربة أفضل. تقطع تجارب المستخدم الأفضل شوطًا طويلاً نحو مساعدتك على تحقيق الأهداف التي كنت تفكر فيها لموقع الويب لديك.
قد يبدو أداء الويب وكأنه موضوع متخصص، ولكنه في الواقع واسع وعميق للغاية. وبالنظر إلى عمقها في الموضوع، من الضروري أن تكون الدورة التدريبية حول الأداء على الويب سهلة وغنية بالمعلومات في الوقت نفسه. يركِّز الإصدار الأولي من هذه الدورة على أساسيات أداء الويب التي يجب أن يجدها المبتدئين مفيدة.
تهدف كل وحدة في هذه السلسلة إلى الحصول - حيثما أمكن ذلك - على مجموعة من العروض التوضيحية التي تكمل محتوى كل وحدة وتوضح المفاهيم الرئيسية للأداء. بما أنّ هذه الدورة التدريبية هي عبارة عن عرض أولي، يتم حاليًا التخطيط لنشر وحدات إضافية في الأشهر المقبلة.
في ما يلي ما يشمله عرض الدورة التدريبية الأولية في ميزة "تعلّم الأداء":
أهمية السرعة
قبل البدء في تحسين أداء التعلُّم، عليك أولاً فهم دوره في تجربة المستخدم، وكيف يمكن أن يؤدي إلى تحقيق نتائج أفضل للمستخدمين. تبدأ هذه الدورة التدريبية بمقدّمة موجزة عن هذه المواضيع، ما يوفّر سياقًا حيويًا يوضّح أهمية معرفة الأداء.
اعتبارات عامة تتعلّق بأداء HTML
يبدأ كل موقع إلكتروني بطلب للحصول على مستند HTML، ويؤدي هذا الطلب دورًا كبيرًا في زيادة سرعة تحميل الموقع. تتناول هذه الوحدة مفاهيم مهمة، مثل التخزين المؤقت بتنسيق HTML وحظر المحلل اللغوي وحظر العرض وغير ذلك، ما يتيح لك التأكّد من أنّ الطلب الأول لتنسيق HTML الخاص بموقعك الإلكتروني لا يستوفي المتطلبات المطلوبة.
فهم المسار الحرج
مسار العرض الحرج هو مفهوم في أداء الويب يتعامل مع مدى سرعة ظهور العرض الأولي للصفحة في المتصفّح. تدخل هذه الوحدة في النظرية الكامنة وراء مسار العرض الحرج، حيث تتناول مفاهيم مثل الموارد لحظر العرض ومنع المحلل اللغوي، وكيف تؤدي هذه الوحدة دورًا رئيسيًا في مدى سرعة ظهور الصفحة في المتصفح.
تحسين تحميل الموارد
أثناء تحميل الصفحة، تتم الإشارة إلى العديد من الموارد في رمز HTML الخاص بها، ما يوفّر الصفحة مظهرها وتنسيقها من خلال CSS، بالإضافة إلى تفاعلها من خلال JavaScript. في هذه الوحدة، سنتناول عددًا من المفاهيم المهمة ذات الصلة بهذه الموارد وكيفية تأثيرها في وقت تحميل الصفحة.
مساعدة المتصفِّح من خلال تقديم تلميحات عن الموارد
تعديلات الموارد هي مجموعة من الميزات المتوفرة بتنسيق HTML والتي يمكنها مساعدة المتصفّح في تحميل الموارد في وقت أبكر من السابق، وربما حتى مع إعطاء أولوية أكبر للموارد. في هذه الوحدة، سنتناول بعض نصائح الموارد التي يمكن أن تساعد في تحميل صفحاتك بشكل أسرع.
أداء الصور
وتمثّل الصور جزءًا كبيرًا من البيانات التي يتم نقلها إلى العديد من صفحات الويب اليوم. تتناول هذه الوحدة طريقة تحسين الصور وعرضها بفعالية لتقليل وحدات البايت المهدرة، بغض النظر عن جهاز المستخدم.
أداء الفيديو
الفيديو هو نوع من أنواع الوسائط المستخدَمة كثيرًا على صفحات الويب، إلا أنّ معرفة كيفية عرضها بكفاءة هي جانب من جوانب الأداء يجب عدم الاستخفاف به. تتناول هذه الوحدة بعض الأساليب الأساسية لتضمين الفيديوهات بطريقة تحافظ على سرعة موقعك الإلكتروني، إضافةً إلى اعتبارات الأداء المرتبطة التي يمكن أن تنشأ عند استخدامها.
تحسين خطوط الويب
تعد خطوط الويب موردًا شائع الاستخدام على الويب - وبشكل صحيح - لأنها تضيف إلى تصميم موقع الويب بطرق لا تستطيع الموارد الأخرى القيام بها. ومع ذلك، لا تزال خطوط الويب تنطوي على تكلفة أداء. في هذه الوحدة، يتم استكشاف عدد من اعتبارات الأداء والتقنيات الخاصة بخطوط الويب.
لغة JavaScript المقسّمة حسب الرمز
بعض الموارد ليست أساسية للتحميل الأولي لصفحة الويب. لغة JavaScript هي أحد الموارد التي يمكن تأجيلها إلى وقت الحاجة من خلال أسلوب يُعرف بتقسيم الرمز. وبذلك، يمكنك تحسين الأداء من خلال خفض معدّل نقل البيانات وتزايد الطلب على وحدة المعالجة المركزية (CPU)، وهو أمر مهم لتحسين سرعة التحميل المبدئي للصفحة واستجابة الإدخالات أثناء بدء التشغيل.
صور التحميل الكسول وعناصر <iframe>
قد تستهلك الصور وعناصر <iframe> قدرًا كبيرًا من معدل نقل البيانات ووقت معالجة وحدة المعالجة المركزية (CPU). مع ذلك، لا يلزم تحميل جميع الصور
وعناصر <iframe> أثناء التحميل الأوليّ للصفحة، ويمكن تأجيلها إلى وقت لاحق يُرجَّح أن يراها المستخدم
فيها. وتُعرف هذه التقنية باسم التحميل الكسول. في هذه الوحدة، يتم شرح صور التحميل الكسول وعناصر <iframe> حتى تتمكّن من تحميل صفحاتك بشكل أسرع، واستهلاك معدّل نقل البيانات ووقت المعالجة عند الحاجة فقط.
الجلب المُسبَق والعرض المُسبَق والتخزين المؤقت لمشغِّلي الخدمات
يتعامل الكثير من الأداء مع ما يمكنك فعله لتحسين الموارد غير الضرورية وإزالتها، قد يبدو الأمر متناقضًا إلى حد ما عند اقتراح تحميل بعض الموارد قبل الحاجة إليها. ومع ذلك، هناك بعض الحالات التي قد يكون من المناسب فيها تحميل موارد معيّنة مسبقًا. في هذه الوحدة، يتم استكشاف هذا الجانب من الأداء، حيث تتم مناقشة الجلب المُسبَق والعرض المُسبَق والتخزين المؤقت لمشغّلي الخدمات.
نظرة عامة على موظفي الويب
يظهر معظم المحتوى في المتصفّح في سلسلة محادثات واحدة تُعرف باسم سلسلة التعليمات الرئيسية. ومع ذلك، هناك فرص تتيح لك بدء سلاسل محادثات جديدة لتنفيذ أعمال مكلفة من الناحية الحسابية حتى تتمكّن سلسلة التعليمات الرئيسية من استيعاب المهام المهمة الموجّهة للمستخدمين. وتُعرف واجهة برمجة التطبيقات التي تنفّذ ذلك باسم Web Worker API، وفي هذه الوحدة نتناول أساسيات هذه الواجهة.
حالة استخدام ملموسة لموظفي الويب
بعد أن تعرّفت على أساسيات العمل على الويب ومدى إمكانياته وحدود قدراته، حان الوقت لإلقاء نظرة على حالة استخدام ملموسة لموظفي الويب. في هذا العرض التوضيحي، يتم استخدام عامل تشغيل على الويب لاسترجاع ملف JPEG واستخراج بياناته الوصفية وإعادة إرساله إلى سلسلة التعليمات الرئيسية حتى يتمكّن المستخدم من الاطّلاع عليه في المتصفّح.
هل أنت مستعد لبدء تعلُّم أداء الويب؟ ابدأ بقراءة الموضوع أولاً من خلال القراءة سبب أهمية السرعة.