البدء بقياس "مؤشرات أداء الويب"

Katie Hempenius
Katie Hempenius

إنّ جمع البيانات عن "مؤشرات أداء الويب" لموقعك الإلكتروني هو الخطوة الأولى نحو تحسينها. سيجمع التحليل الشامل بيانات الأداء من البيئات الواقعية والمعملية. يتطلّب قياس مقياسات Web Vitals إجراء تغييرات بسيطة على الرمز البرمجي، ويمكن تنفيذ ذلك باستخدام أدوات مجانية.

قياس "مؤشرات أداء الويب" باستخدام بيانات RUM

تُسجِّل بيانات مراقبة المستخدِمين الفعليين (RUM)، المعروفة أيضًا باسم بيانات الحقول، الأداء الذي يشهده المستخدِمون الفعليون لموقع إلكتروني. تستخدم Google بيانات RUM لتحديد ما إذا كان الموقع الإلكتروني يستوفي معايير "Core Web Vitals" المقترَحة.

الخطوات الأولى

إذا لم يكن لديك إعداد RUM، ستوفّر لك الأدوات التالية بيانات سريعة عن الأداء الفعلي لموقعك الإلكتروني. تستند جميع هذه الأدوات إلى مجموعة البيانات الأساسية نفسها (تقرير تجربة المستخدم في Chrome)، ولكنّها لها حالات استخدام مختلفة قليلاً:

  • يتم دمج أدوات مطوّري البرامج في Chrome مع مجموعة بيانات CrUX في عرض المقاييس المباشرة ضمن لوحة "الأداء". من خلال مقارنة تجربتك المحلية مع تجارب المستخدمين في الصفحة نفسها، يمكنك اتخاذ قرار مدروس بشكل أفضل بشأن الجوانب التي يجب تركيز الجهود عليها في تصحيح الأخطاء. إذا كنت تبحث عن إجراء واحد اتّخاذه للبدء في قياس مقياسات Web Vitals لموقعك الإلكتروني وتحسينها، ننصحك باستخدام لوحة الأداء في "أدوات مطوّري البرامج" في Chrome.
  • تقدّم إحصاءات PageSpeed (PSI) تقارير عن الأداء المجمّع على مستوى الصفحة وعلى مستوى المصدر خلال آخر 28 يومًا. بالإضافة إلى ذلك، تقدّم الأداة اقتراحات حول كيفية تحسين الأداء. تتوفّر PSI على الويب وكواجهة برمجة تطبيقات.
  • تُبلِغ Search Console عن بيانات الأداء على أساس كل صفحة. ما يجعله مناسبًا لتحديد صفحات معيّنة تحتاج إلى تحسين. على عكس "إحصاءات PageSpeed"، تتضمن تقارير Search Console بيانات الأداء السابق. لا يمكن استخدام Search Console إلا مع المواقع الإلكترونية التي تملكها وأثبتّ ملكيتها.
  • لوحة بيانات CrUX هي لوحة بيانات مُعدّة مسبقًا تعرِض بيانات CrUX لمصدر من اختيارك. فهي تستند إلى "مركز البيانات" وتستغرق عملية الإعداد حوالي دقيقة. مقارنةً بخدمة PageSpeed Insights وSearch Console، تتضمّن تقارير لوحة بيانات CrUX المزيد من السمات، على سبيل المثال، يمكن تقسيم البيانات حسب الجهاز ونوع الاتصال.

تجدر الإشارة إلى أنّه على الرغم من أنّ الأدوات المُدرَجة سابقًا مناسبة تمامًا "للبدء" بقياس "مؤشرات أداء الويب"، إلا أنّها يمكن أن تكون مفيدة في سياقات أخرى أيضًا. على وجه الخصوص، يتوفّر كلّ من CrUX وPSI كواجهة برمجة تطبيقات ويمكن استخدامهما لإنشاء لوحات البيانات وإعداد التقارير الأخرى.

جمع بيانات RUM

وعلى الرغم من أنّ الأدوات المستندة إلى CrUX هي نقطة بداية جيدة للتحقق من أداء مؤشرات أداء الويب، فإننا ننصح بشدة بإكمالها باستخدام RUM الخاص بك. يمكن أن تقدّم بيانات مراقبة المستخدمين في الوقت الفعلي التي تجمعها بنفسك ملاحظات أكثر تفصيلاً وفورية حول أداء موقعك الإلكتروني. يسهّل ذلك تحديد المشاكل واختبار الحلول المحتملة.

يمكنك جمع بيانات RUM بالاستعانة بموفِّر خدمة RUM مخصص أو عن طريق إعداد أدواتك الخاصة.

يتخصص مقدمو RUM المخصصون في جمع بيانات RUM وإعداد تقارير عنها. لاستخدام "مؤشرات أداء الويب الأساسية" مع هذه الخدمات، اسأل مزوّد RUM عن تفعيل مراقبة "مؤشرات أداء الويب الأساسية" لموقعك الإلكتروني.

إذا لم يكن لديك مقدّم خدمة RUM، قد تتمكّن من تحسين إعدادات الإحصاءات الحالية لجمع هذه المقاييس وإعداد تقارير عنها باستخدام web-vitals مكتبة JavaScript. سنوضّح هذه الطريقة بالتفصيل في ما يلي.

مكتبة JavaScript لقياس مقياسات الأداء الرئيسية

إذا كنت بصدد تنفيذ إعداد RUM الخاص بك لخدمة "مؤشرات أداء الويب"، فإنّ أسهل طريقة لجمع قياسات "مؤشرات أداء الويب" هي استخدام مكتبة JavaScript web-vitals. web-vitals هي مكتبة صغيرة مؤلفة من وحدات (تبلغ مساحتها حوالي 2 كيلوبايت) وتوفّر واجهة برمجة تطبيقات ملائمة لجمع كل مقاييس "مؤشرات أداء الويب الأساسية" القابلة للقياس في الميدان وإعداد تقارير عنها.

لا تعرض واجهات برمجة التطبيقات المضمّنة للأداء في المتصفّح جميع المقاييس التي تشكّل "مؤشرات أداء الويب" مباشرةً، بل يتم إنشاؤها استنادًا إليها. على سبيل المثال، يتم تنفيذ متغيّرات التصميم التراكمية (CLS) باستخدام واجهة برمجة تطبيقات عدم استقرار التنسيق. باستخدام web-vitals، لا داعي للقلق بشأن تنفيذ هذه المقاييس بنفسك، كما أنّه يضمن أيضًا أن تتطابق البيانات التي تجمعها مع المنهجية وأفضل الممارسات لكل مقياس.

لمزيد من المعلومات حول تنفيذ web-vitals، يُرجى الرجوع إلى المستندات ودليل أفضل الممارسات لقياس مؤشرات Web Vitals في المجال.

تجميع البيانات

من الضروري الإبلاغ عن القياسات التي جمعتها web-vitals. لن تظهر لك هذه البيانات أبدًا إذا تم قياس هذه البيانات بدون الإبلاغ عنها. تتضمّن مستندات web-vitals أمثلة تعرض كيفية إرسال البيانات إلى نقطة نهاية عامة لواجهة برمجة التطبيقات أو إحصاءات Google أو إدارة العلامات من Google.

إذا كانت لديك أداة إعداد تقارير مفضّلة، ننصحك باستخدامها. إذا لم يكن الأمر كذلك، يمكنك استخدام "إحصاءات Google" التي تتوفّر مجانًا لهذا الغرض.

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

تفسير البيانات

عند تحليل بيانات الأداء، من المهم الانتباه إلى أطراف التوزيع. غالبًا ما تكشف بيانات RUM أن الأداء يختلف بشكل كبير - فبعض المستخدمين لديهم تجارب سريعة، والبعض الآخر لديهم تجارب بطيئة. ومع ذلك، يمكن أن يؤدي استخدام المتوسط لتلخيص البيانات إلى إخفاء هذا السلوك.

في ما يتعلق بمؤشرات أداء الويب، يستخدم محرّك بحث Google النسبة المئوية للتجارب "الجيدة"، بدلاً من الإحصاءات مثل المتوسطات أو المتوسّطات، لتحديد ما إذا كان الموقع الإلكتروني أو الصفحة يستوفي الحدود المقترَحة. وعلى وجه التحديد، لكي يتم اعتبار الموقع الإلكتروني أو الصفحة على أنّه يستوفي حدود "مؤشرات أداء الويب الأساسية"، يجب أن تستوفي% 75 من زيارات الصفحة الحدّ الأدنى لهذه الحالة لكل مقياس.

قياس "مؤشرات أداء الويب" باستخدام بيانات المختبر

يتم جمع بيانات المختبر، المعروفة أيضًا باسم البيانات الاصطناعية، من بيئة خاضعة للرقابة، بدلاً من المستخدمين الفعليين. على عكس بيانات RUM، يمكن جمع بيانات الميزة الاختبارية من بيئات ما قبل الإنتاج، وبالتالي دمجها في سير عمل المطوّرين وعمليات الدمج المستمر. ومن الأمثلة على الأدوات التي تجمع البيانات التركيبية أداة Lighthouse وWebPageTest.

الاعتبارات

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

  • يمكن أن يختلف مقياس سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP) الذي يتم قياسه في البيئات الاختبارية عن المقياس الذي يتم قياسه في الميدان باستخدام بيانات RUM، وذلك بسبب التأخيرات في تحميل الصفحة (من خلال عمليات إعادة التوجيه أو وقت الاستجابة في الاتصال بالخادم أو البيانات غير المخزّنة مؤقتًا) أو المحتوى المختلف الذي يتم عرضه للمستخدمين المختلفين حسب الشاشة، أو لأسباب أخرى (بما في ذلك إعلانات البانر التي تستخدم ملفات تعريف الارتباط والتخصيص).
  • يمكن أن تكون متغيّرات التصميم التراكمية (CLS) التي تم قياسها في المختبرات أقل بشكل مصطنع من متغيّرات التصميم التراكمية (CLS) التي يتم قياسها في بيانات RUM. لا تتفاعل العديد من أدوات المختبر مع الصفحة، بل تحمّلها فقط. ونتيجةً لذلك، لا يتم تسجيل سوى التغيُّرات في التصميم التي تحدث أثناء التحميل الأولي للصفحة. في المقابل، ترصد أدوات RUM متغيّرات التصميم التراكمية (CLS) التي تحدث خلال فترة عرض الصفحة بأكملها.
  • لا يمكن قياس مدى استجابة الصفحة لتفاعلات المستخدم (INP) في البيئات الاختبارية لأنّه يتطلّب تفاعلات المستخدم مع الصفحة. ونتيجةً لذلك، فإنّ إجمالي وقت الحظر (TBT) هو المقياس البديل المقترَح لقياس سرعة الاستجابة في المختبر. يقيس مقياس TBT "إجمالي الوقت بين سرعة عرض المحتوى على الصفحة ووقت التفاعل الذي يتم خلاله حظر الصفحة من الاستجابة لإدخالات المستخدم". على الرغم من أنّه يتم احتساب INP وTBT بشكلٍ مختلف، إلا أنّهما يعكسان مؤشرَي مسار المعالجة الرئيسي المحظور أثناء عملية التحميل المبدئي. عند حظر سلسلة المحادثات الرئيسية، يتأخّر المتصفّح في الاستجابة لتفاعلات المستخدمين.

الأدوات

يمكن استخدام هذه الأدوات لجمع قياسات مختبرية لمؤشرات أداء الويب:

  • تقيس أدوات مطوري البرامج في Chrome "مؤشرات أداء الويب الأساسية" لصفحة معيّنة وتقدّم تقارير عنها في عرض المقاييس المباشرة في لوحة "الأداء". تقدّم طريقة العرض هذه للمطوّرين ملاحظات حول الأداء في الوقت الفعلي أثناء إجراء تغييرات على الرموز البرمجية.
  • Lighthouse يقدّم تقرير Lighthouse معلومات عن LCP وCLS وTBT، ويُبرز أيضًا التحسينات المحتملة في الأداء. تتوفّر أداة Lighthouse في Chrome DevTools، بصفتها حزمة npm، ويمكن أيضًا دمجها في عمليات سير العمل للدمج المستمر باستخدام Lighthouse CI.
  • يتضمّن WebPageTest مؤشرات أداء الويب كجزء من تقاريره العادية. يُعدّ WebPageTest مفيدًا لجمع معلومات عن "مؤشرات أداء الويب" في ظروف معيّنة للأجهزة والشبكات.