سير عمل "مؤشرات أداء الويب الأساسية" باستخدام أدوات Google

يمكنك الجمع بين أدوات Google لتدقيق موقعك الإلكتروني وتحسينه ومراقبته بفعالية.

تاريخ النشر: 28 أيار (مايو) 2020

مؤشرات أداء الويب الأساسية هي مجموعة من المقاييس التي تقيّم تجربة المستخدم استنادًا إلى معايير مثل أداء التحميل والاستجابة لإدخالات المستخدم وثبات التنسيق.

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

من الأفضل قياس مؤشرات "Core Web Vitals" في المجال

تم تصميم "مؤشرات أداء الويب الأساسية" خصيصًا لقياس تجربة المستخدمين في موقعك الإلكتروني، وهي مقاييس تركِّز على المستخدم. إنّ الأدوات المستنِدة إلى المختبرات، مثل Lighthouse، هي أدوات تشخيصية لتسليط الضوء على مشاكل الأداء المحتملة وأفضل الممارسات. يتم تشغيل الأدوات المستندة إلى المختبر بشروط معيّنة ومحدّدة مسبقًا، وقد لا تعكس القياسات الواقعية التي تتم في مؤشرات Core Web Vitals.

على سبيل المثال، Lighthouse هي أداة تستند إلى المختبرات وتُجري اختبارات من خلال محاكاة التقييد في بيئة محاكاة للكمبيوتر المكتبي أو الأجهزة الجوّالة. على الرغم من أنّ عمليات المحاكاة لحالات البطء في الشبكة والأجهزة تكون مفيدة عند محاولة تشخيص مشاكل الأداء، فهي لا تشكّل سوى شريحة واحدة من مجموعة كبيرة ومتنوعة من حالات الشبكة وإمكانات الأجهزة، وبالتالي قد لا تعكس ما يواجهه المستخدمون على مواقعك الإلكترونية.

وعادةً ما تُجري الأدوات المستندة إلى المختبرات، مثل Lighthouse، "تحميلًا باردًا" لصفحة ويب كزائر جديد تمامًا. غالبًا ما يكون هذا هو أبطأ وقت تحميل، ولكن في الواقع، قد يتم تخزين بعض مواد العرض في ذاكرة التخزين المؤقت إذا سبق للزوّار زيارة الموقع الإلكتروني أو عند تصفّحهم للموقع الإلكتروني. قد يواجه الزوّار والأدوات الجديدة أيضًا الموقع الإلكتروني بشكل مختلف من خلال إعلانات البانر لملفات تعريف الارتباط أو محتوى آخر يتم عرضه عليهم.

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

تقيس Google "مؤشرات أداء الويب الأساسية" من خلال تقرير تجربة المستخدم في Chrome (CrUX). هذه مجموعة بيانات عامة تم جمعها من مستخدمي Chrome الفعليين. وهي العمود الفقري للعديد من أدوات Google والأدوات التابعة لجهات خارجية التي تُبلغ عن "مؤشرات أداء الويب الأساسية" لموقع إلكتروني.

ومع ذلك، فإنّ CrUX لها قيودها. يمكن أن يُعلمك هذا التقرير غالبًا عندما تحدث مشكلة، ولكن لا تتوفّر لديه في أغلب الأحيان بيانات كافية لإعلامك بالسبب.

جمع بياناتك الميدانية إذا أمكن

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

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

ومع ذلك، قد لا تكون جزءًا من مؤسسة كبيرة، أو حتى مؤسسة لديها الوسائل اللازمة لتوفير حل تابع لجهة خارجية. في هذه الحالات، ستساعدك web-vitals مكتبة Google في جمع جميع مقياسات Web Vitals. ومع ذلك، ستكون أنت المسؤول عن كيفية إعداد تقارير عن هذه البيانات وتخزينها وتحليلها.

إذا كنت تستخدم "إحصاءات Google"، ولكنّك لم تبدأ في جمع بيانات موقعك، قد يكون بإمكانك استخدام مكتبة web-vitals لإرسال "مؤشرات الأداء الرئيسية للويب" التي تم جمعها في الموقع إلى "إحصاءات Google" واستخدام عمليات تصدير BigQuery في "إحصاءات Google‏ 4" لإعداد تقارير عن البيانات.

فهم أدوات Google

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

تقرير تجربة المستخدم على Chrome (CrUX)

كما ذكرنا سابقًا، CrUX هي مجموعة بيانات عامة تضمّ بيانات الاستخدام الفعلي التي تم جمعها من شريحة من مستخدمي Google Chrome الفعليين من ملايين المواقع الإلكترونية. ويتضمّن هذا التقرير مقاييس "مؤشرات أداء الويب الأساسية" ومقاييس أخرى للمواقع الإلكترونية التي تسجِّل عددًا كافيًا من الزيارات.

تتوفّر تقرير تجربة المستخدم على Chrome على شكل مجموعة بيانات BigQuery شهرية على مستوى المصدر، أو كواجهة برمجة تطبيقات يومية على مستوى عنوان URL أو المصدر، شرط أن يحتوي عنوان URL أو المصدر على نماذج كافية في مجموعة بيانات CrUX. يمكن أيضًا عرض بيانات BigQuery في لوحة بيانات CrUX، ما يتيح للمواقع الإلكترونية مراجعة المؤشرات السابقة لموقعها الإلكتروني.

حالات استخدام CrUX

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

يمكنك استخدام CrUX مباشرةً أو باستخدام أداة أخرى (بما في ذلك تلك المذكورة أدناه). إنّ استخدام مجموعة بيانات CrUX مباشرةً، إما باستخدام BigQuery أو واجهة برمجة التطبيقات، مفيد لعرض البيانات التي لا تظهر في الأدوات الأخرى، على سبيل المثال، لا تتوفّر البيانات على مستوى البلد غالبًا في الأدوات الأخرى، أو لعرض المقاييس الإضافية في CrUX التي لا تظهر غالبًا في الأدوات الأخرى.

الحالات التي لا تُستخدَم فيها أداة CrUX

لا يمثّل CrUX سوى مستخدمي Chrome، وحتى في هذه الحالة، لا يمثّل سوى مجموعة فرعية من مستخدمي Chrome. يمكن أن يتضمّن حلّ RUM كاملاً المزيد من التجارب على Chrome والمتصفّحات الأخرى التي تتيح استخدام مقاييس Web Vitals.

لا يتم تضمين المواقع الإلكترونية التي لا تتلقّى عددًا كافيًا من الزيارات في مجموعة بيانات CrUX. إذا كان هذا هو الحال، عليك جمع بياناتك الميدانية لفهم أداء موقعك الإلكتروني في الميدان، لأنّ تقرير تجربة المستخدم على Chrome لن يكون خيارًا متاحًا. وبدلاً من ذلك، عليك الاعتماد على بيانات المختبر، ولكن مع بعض القيود التي قد لا يتم تمثيلها كما هو موضّح سابقًا.

بما أنّ البيانات التي يوفّرها تقرير "تجربة المستخدِم على Chrome" هي متوسّط متجدّد على مدار آخر 28 يومًا، فإنّه ليس أداة مثالية أثناء التطوير، لأنّه سيستغرق الأمر قدرًا لا بأس به من الوقت ليظهر التحسين في مجموعة بيانات "تجربة المستخدِم على Chrome".

أخيرًا، بما أنّ "تقرير تجربة المستخدِم على Chrome" هو مجموعة بيانات عامة، فهو محدود بكمية المعلومات التي يمكنه إتاحتها وطريقة طلب هذه البيانات. من خلال تسجيل بيانات RUM الخاصة بك، يمكنك جمع المزيد من التفاصيل (مثل عنصر LCP) وتقسيم البيانات بشكل أكبر لتحديد المشاكل. هل يحصل المستخدمون الذين سجّلوا الدخول على نتائج أفضل أو أسوأ من "مؤشرات أداء الويب الأساسية" مقارنةً بالمستخدمين الذين لم يسجّلوا الدخول؟ هل يتفاعل المستخدمون الذين لديهم سرعة LCP بطيئة مع عنصر معيّن لسرعة عرض أكبر محتوى مرئي؟ ما هي التفاعلات التي تؤدي إلى ارتفاع قيم FID وINP؟

PageSpeed Insights (PSI)

أداة PSI هي أداة تعمل على الإبلاغ عن البيانات الميدانية من خلال تقرير تجربة المستخدم (CrUX) والمختبر من Lighthouse لصفحة معيّنة. اطّلِع على هذه الأقسام الفردية للحصول على مزيد من التفاصيل.

حالات استخدام مقياس PSI

تُعدّ أداة PageSpeed Insights رائعة لتقييم أداء CrUX على مستوى الصفحة أو مستوى المصدر، لكل من مستخدمي الأجهزة الجوّالة وأجهزة الكمبيوتر المكتبي. وهو خيار جيد للحصول على نظرة عامة أولية على "مؤشرات أداء الويب الأساسية" لصفحة أو موقع إلكتروني. ويتيح لك أيضًا عرض بيانات "مؤشرات أداء الويب الأساسية" للمواقع الإلكترونية الأخرى، مثل المواقع الإلكترونية المنافسة.

توفّر أداة PSI أيضًا بيانات Lighthouse التي تقدّم اقتراحات مفيدة لتحسين "مؤشرات أداء الويب الأساسية"، في حال تطابق المقاييس. وفي حال عدم تطابق هذه المعايير، قد تكون اقتراحات Lighthouse أقل صلة بموضوع الصفحة.

بما أنّه يتم تشغيل Lighthouse من الخادم، يمكن أن يشكّل أساسًا أكثر اتساقًا من تشغيل Lighthouse من DevTools.

الحالات التي لا تُستخدَم فيها ميزة "الوصول الواعي بالسياق"

لا تتوفّر ميزة PSI إلا لعناوين URL المتاحة للجميع. ولا يمكن استخدامها على المواقع الإلكترونية المخصّصة للتطوير والتي لا يمكن للجميع الوصول إليها.

لا تتوفّر بيانات "تقرير تجربة المستخدِم على Chrome" إلا عندما تستوفي المواقع الإلكترونية معايير أهلية معيّنة، بما في ذلك حدود شعبية الموقع الإلكتروني. تكون أداة PageSpeed Insights أقل فائدة عندما لا تتوفّر بيانات CrUX لصفحة أو مصدر، لأنّها لا يمكنها عرض بيانات مختبر Lighthouse إلا في هذه الحالات.

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

أخيرًا، عندما تتوفّر بيانات على مستوى الصفحة في CrUX، ولكنها تختلف عن بيانات مختبر Lighthouse، قد تكون اقتراحات Lighthouse ذات قيمة محدودة. ويمكن أن يحدث ذلك بشكل خاص لمشاكل متغيّرات التصميم التراكمية (CLS) بعد التحميل، ومؤشرات "مؤشرات أداء الويب الأساسية" التفاعلية (FID وINP) التي تكون فيها عمليات التدقيق في المختبر أقل فائدة.

Search Console

تقيس Search Console عدد الزيارات الواردة من "شبكة بحث Google" إلى موقعك الإلكتروني ومستوى أدائه، بما في ذلك "مؤشرات أداء الويب الأساسية". ولا تتوفّر إلا لمالكي المواقع الإلكترونية الذين أكّدوا ملكيتهم للموقع.

من الميزات القيّمة في Search Console أنها تجمِّع الصفحات المتشابهة (مثل الصفحات التي تستخدم النموذج نفسه) في تقييم جماعي واحد. تتضمّن Search Console أيضًا تقرير "مؤشرات أداء الويب الأساسية" استنادًا إلى بيانات الاستخدام الفعلي من CrUX.

حالات استخدام Search Console

تُعدّ خدمة Search Console مناسبة تمامًا للمطوّرين وغير المطوّرين لتقييم أداء كلّ من البحث والصفحات بطرق لا تتوفّر في أدوات Google الأخرى. من خلال عرض بيانات CrUX وتجميع الصفحات حسب التشابه، تقدّم هذه البيانات إحصاءات جديدة حول كيفية تأثير تحسينات الأداء في فئات كاملة من الصفحات.

الحالات التي لا تُستخدَم فيها Search Console

قد لا تكون Search Console مناسبة للمشاريع التي تستخدم أدوات خارجية مختلفة تُجمِّع الصفحات حسب التشابه، أو إذا لم يكن الموقع الإلكتروني ممثّلاً في مجموعة بيانات CrUX.

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

منارة

Lighthouse هي أداة معملية توفّر فرصًا معيّنة لتحسين أداء الصفحات. تسمح مسارات المستخدِمين في Lighthouse للمطوّرين أيضًا بكتابة نصوص برمجية لمسارَي التفاعل من أجل اختبار الأداء خارج نطاق تحميل الصفحة.

Lighthouse-CI هي أداة ذات صلة تعمل على تشغيل Lighthouse أثناء عمليات إنشاء المشاريع ونشرها للمساعدة في اختبار الانحدار في الأداء. ويعرض تقرير Lighthouse بالإضافة إلى طلبات سحب الرمز البرمجي، ويتتبّع مقاييس الأداء بمرور الوقت.

حالات استخدام Lighthouse

إنّ Lighthouse ممتاز للعثور على فرص تحسين الأداء أثناء التطوير في كلّ من البيئتَين المحلية والتجريبية. يكون Lighthouse CI مفيدًا بالمثل في مراحل الإنشاء والنشر في بيئات الاختبار والإنتاج، حيث يكون اختبار الرجوع إلى الوراء للأداء مطلوبًا للحفاظ على تجارب المستخدمين الجيدة.

الحالات التي لا تُستخدَم فيها أداة Lighthouse

لا يُعدّ Lighthouse (أو Lighthouse CI) بديلاً لبيانات الحقل. أداة Lighthouse هي في الأساس أداة تشخيص تُدرج المشاكل المحتمَلة وأفضل الممارسات من عملية تحميل صفحة محدّدة مسبقًا. وقد لا تتطابق الاقتراحات التي يعرضها دائمًا مع الأداء الذي يشهده المستخدمون.

على الرغم من أنّه يمكن استخدام Lighthouse لتشخيص المواقع الإلكترونية المنشورة من خلال أدوات مثل "إحصاءات PageSpeed"، من الأفضل استخدام Lighthouse في بيئات التطوير والدمج المستمر لحلّ مشاكل الأداء قبل أن تصل إلى مرحلة النشر.

لوحة "الأداء" في "أدوات مطوري البرامج في Chrome"

أدوات مطوّري البرامج في Chrome هي مجموعة من أدوات التطوير داخل المتصفّح، بما في ذلك لوحة الأداء. لوحة "الأداء" هي أداة تجريبية تتألف من "وضعَين":

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

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

حالات استخدام لوحة الأداء

على المطوّرين استخدام لوحة "الأداء" للحصول على إحصاءات معمّقة عن أداء صفحة معيّنة.

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

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

الحالات التي لا تُستخدَم فيها لوحة "الأداء"

لوحة "الأداء" هي أداة للمطوّرين تقدّم بشكل أساسي بيانات المختبر، مع بعض السياق من تقرير "تجربة مستخدِم Chrome". وهي ليست بديلاً عن بيانات الحقول.

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

سير عمل من ثلاث خطوات لضمان الحفاظ على صحة مؤشرات Core Web Vitals الخاصة بموقعك الإلكتروني

عند العمل على تحسين تجربة المستخدم، من الأفضل اعتبار العملية دورة مستمرة. لتحسين "مؤشرات أداء الويب الأساسية" ومقاييس الأداء الأخرى، يمكن اتّباع أحد النهجَين التاليَين:

  1. تقييم حالة الموقع الإلكتروني وتحديد المشاكل
  2. حلّ المشاكل وتحسين الأداء
  3. يمكنك مراقبة الأداء باستخدام أدوات التكامل المستمر لرصد حالات التراجع في الأداء وتجنُّبها.
العملية الثلاثية الخطوات، معروضة كدورة مستمرة تظهر الخطوة الأولى "تقييم حالة الموقع الإلكتروني وتحديد نقاط التحسين"، والخطوة الثانية "تصحيح الأخطاء وتحسين الأداء"، والخطوة الثالثة "التتبّع والتطوير المستمر".
سير العمل المكوّن من ثلاث خطوات

الخطوة 1: تقييم حالة الموقع الإلكتروني وتحديد فرص التحسين

من الأفضل البدء ببيانات الحقل لتقييم حالة الموقع الإلكتروني.

  1. استخدِم إحصاءات PageSpeed للاطّلاع على مقاييس تجربة "مؤشرات أداء الويب الأساسية" العامة في المصدر ومعلومات محدّدة عن عنوان URL فردي.
  2. يمكن أن تكون خدمة Search Console مفيدة لتحديد الصفحات التي تحتاج إلى تحسين حيث تعمل ميزة تجميع الصفحات بشكل جيد على موقعك الإلكتروني.
  3. إذا كانت لديك بيانات RUM، يكون غالبًا الخيار الأفضل لتتمكّن من تحديد صفحات أو شرائح جمهور معيّنة تتضمّن مشاكل.

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

تحليل أداء الموقع الإلكتروني باستخدام "إحصاءات PageSpeed"

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

تعرض "إحصاءات PageSpeed" بيانات CrUX التي تغطي آخر 28 يومًا من بيانات تجربة المستخدم في الشريحة المئوية الخامسة والسبعين. وهذا يعني أنّه إذا كانت نسبة %75 من تجارب المستخدمين تستوفي الحدّ الأدنى الذي تمّ ضبطه لمقياس معيّن، تُعتبر التجربة "جيدة".

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

ركِّز على قسم ما يواجهه المستخدمون الحقيقيون في مؤشر PSI في البداية. سيظهر لك ما يصل إلى أربع طرق عرض للبيانات: الأجهزة الجوّالة وأجهزة الكمبيوتر المكتبي لعنوان URL الذي أدخلته والمصدر بأكمله. قارِن بين هذه الأنواع واطّلِع على أوجه الاختلاف بينها. عادةً ما يكون أداء الأجهزة الجوّالة أقل من أداء أجهزة الكمبيوتر المكتبي لأنّها أجهزة ذات موارد محدودة تعمل في ظروف شبكة قد تكون أقل ثباتًا. إذا كان هناك اختلاف كبير بين عنوان URL وبيانات المصدر، حاوِل فهم السبب: الصفحات الرئيسية غالبًا ما تكون هي الصفحات الأولى التي تمت زيارتها (أي الصفحة المقصودة)، لذا قد تكون هذه الصفحات أبطأ من تلك التي يتحمّلها مستخدمو الإصدار الأصلي بشكل كامل من ذاكرة التخزين المؤقت غير المُعدّة للمتصفّح. من المحتمل أن يتم تحميل الصفحات اللاحقة بشكل أسرع، إذ سيتم تخزين أي مواد عرض مشتركة مؤقتًا، ما يؤدي إلى خفض البيانات المجمّعة على مستوى المصدر.

تعرِض أداة PSI أيضًا جميع مقاييس "مؤشرات أداء الويب الأساسية" الثلاثة (سرعة عرض أكبر محتوى مرئي (LCP) ومتغيّرات التصميم التراكمية (CLS) ومدى استجابة الصفحة لتفاعلات المستخدم (INP)) بالإضافة إلى مقياسَي وقت استجابة خادم الويب (TTFB) وسرعة عرض أوّل جزء من المحتوى على الصفحة (FCP) التشخيصيين. هل يتعذّر على أي من مؤشرات Core Web Vitals، وما مدى تأثيرها؟ سيساعدك ذلك في تحديد المكان الذي يجب أن تركّز فيه جهودك.

فهم العلاقات بين هذه الأرقام، لا سيما مقياس LCP إذا كان مقياس LCP بطيئًا، كما هو الحال في هذا المثال، اطّلِع على مقياسَي TTFB وFCP اللذَين يمثّلان معيارَين رئيسيَّين لهذا المقياس. في هذا المثال، يبلغ وقت استجابة خادم الويب 1.8 ثانية، ما سيصعّب كثيرًا تحقيق الحدّ الأدنى المُقترَح الذي يبلغ 2.5 ثانية للحصول على نتيجة جيدة لمقياس LCP. يشير ذلك إلى أنّ سرعة التحميل من الخلفية بطيئة (مشاكل في الخادم أو عدم توفّر شبكة توصيل المحتوى) أو أنّ الشبكات بطيئة أو أنّ عمليات إعادة التوجيه تؤخّر وصول أوّل بايت من ملف HTML. اطّلِع على دليل تحسين وقت الاستجابة للصفحة للحصول على مزيد من المعلومات. تستغرق سرعة عرض المحتوى على الصفحة ثانية أخرى بالإضافة إلى ذلك، ما قد يشير مرة أخرى إلى الشبكات الأبطأ. لم يمرّ مقياس LCP بفترة طويلة بعد أن يشير في هذا المثال إلى أنّ مورد LCP قد تم تحسينه بشكل جيد بعد تحميل الصفحة نفسها.

بالنسبة إلى مقياس CLS، اطّلِع على نتائج CLS في CrUX وCLS في Lighthouse لمعرفة ما إذا كانت هذه مشكلة في وقت تحميل مقياس CLS (سترصدها أداة Lighthouse وتقدّم لك النصائح بشأنها) أو مشكلة في وقت ما بعد تحميل مقياس CLS لن ترصدها أداة Lighthouse. لمزيد من المعلومات، اطّلِع على دليل CLS في "أدوات تحسين الأداء من Google".

للاطّلاع على مستوى الاستجابة، اطّلِع على نتائج INP. اطّلِع على عمليات تدقيق TBT في Lighthouse لمعرفة ما إذا كان يتمّ تنفيذ الكثير من عمليات معالجة JavaScript أثناء التحميل الأوّلي للصفحة، ما يُحتمل أن يؤثّر في مقياس INP. قد يكون من الصعب تحسين مقياس INP، لذا يُرجى الرجوع إلى دليل تحسين INP للحصول على مزيد من المعلومات.

تحديد الصفحات التي تحقّق أداءً ضعيفًا في Search Console

تقرير "مؤشرات أداء الويب الأساسية" في Search Console. يتم تقسيم التقرير إلى فئتَي "أجهزة الكمبيوتر المكتبي" و"الأجهزة الجوّالة"، مع توفير رسوم بيانية خطية تفصِّل توزيع الصفحات التي تتضمّن "مؤشرات أداء الويب الأساسية" في فئات "جيّد" و"بحاجة إلى تحسين" و"بطيء" بمرور الوقت.
تحديد الصفحات الضعيفة الأداء في Search Console

على الرغم من أنّ فحص ملفات الارتباط (PSI) مفيد عندما يكون لديك عنوان URL محدّد تريد اختباره أو الموقع الإلكتروني ككل، يمكن أن تساعدك Search Console في توجيه جهودك إلى أنواع معيّنة من الصفحات. ويُعدّ ذلك مفيدًا بشكل خاص إذا كانت العديد من الصفحات تتشارك مواضيع أو تقنيات شائعة ويمكن لخدمة Search Console تحديدها بنجاح.

يعرض تقرير "مؤشرات أداء الويب الأساسية" في Search Console الصورة الكبيرة لأداء موقعك الإلكتروني، ولكن لا يزال بإمكانك التوغّل في صفحات معيّنة تستدعي الانتباه. باستخدام Search Console، يمكنك أيضًا إجراء ما يلي:

  • حدِّد مجموعات الصفحات الفردية التي تحتاج إلى تحسين والمجموعات التي توفّر تجربة مستخدم جيدة.
  • الحصول على بيانات دقيقة عن الأداء حسب عنوان URL مجمّعة حسب الحالة والمقياس ومجموعات صفحات الويب المتشابهة (مثل صفحات تفاصيل المنتجات على موقع إلكتروني للتجارة الإلكترونية)
  • يمكنك الحصول على تقارير تفصيلية تضمّ عناوين URL في كلّ فئة من فئات جودة تجربة المستخدم لكلّ من الأجهزة الجوّالة وأجهزة الكمبيوتر المكتبي.

بعد اختيار بعض الصفحات المحدّدة للاطّلاع عليها، يمكنك استخدام مؤشر PSI كما هو موضّح سابقًا للتعرّف أكثر على المشاكل المتعلّقة بهذه الصفحات.

الخطوة 2: تصحيح الأخطاء وتحسين الأداء

في الخطوة 1، من المفترض أن تكون قد حدّدت الصفحات التي تتطلّب تحسينات في الأداء، بالإضافة إلى مقاييس "مؤشرات أداء الويب الأساسية" التي تريد تحسينها. يمكنك استخدام أدوات Google للحصول على مزيد من المعلومات لفهم السبب الأساسي لتحديد المشكلة.

  1. إجراء عملية تدقيق في Lighthouse للحصول على إرشادات على مستوى الصفحة
  2. استخدِم عرض المقاييس المباشرة في لوحة الأداء لتحليل "مؤشرات أداء الويب الأساسية" في الوقت الفعلي.
  3. استخدِم ميزة التتبّع في لوحة "الأداء" لتصحيح أخطاء الأداء واختبار تغييرات الرموز البرمجية.

للحصول على إرشادات أكثر تفصيلاً، يمكنك الاطّلاع على هذه الأدلة:

اكتشاف الفرص باستخدام Lighthouse

تعمل "إحصاءات PageSpeed" على تشغيل Lighthouse نيابةً عنك، ولكن في حال التطوير على الجهاز، من الممكن أيضًا تشغيل Lighthouse من "أدوات مطوّري البرامج في Chrome"، وهو أمر مفيد للتحقّق من الإصلاحات على الجهاز.

تقرير Lighthouse ضمن "أدوات مطوّري البرامج في Chrome" يقسّم التقرير النتائج على مستوى خمس فئات، مع التركيز على فئة "الأداء"، مع عرض النتائج في أسفل نافذة التقرير.
تقرير Lighthouse

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

عندما تقترح مقاييس Lighthouse مشكلة مشابهة للمشكلة التي تحاول حلّها، يمكن أن تساعدك المعلومات الوافرة في عمليات التدقيق في تحديد المشاكل واقتراح الحلول.

يمكنك فلترة عمليات التدقيق لتظهر فقط في "مؤشرات أداء الويب الأساسية" التي تهمّك للتركيز على إصلاح المشاكل المتعلّقة بمقياس معيّن:

خيارات فلترة Lighthouse للمقاييس الرئيسية
خيارات فلترة Lighthouse

بالنسبة إلى INP، استخدِم عمليات تحقّق TBT لتحديد المشاكل التي يمكن أن تؤثّر في هذه المقاييس، ولكن عليك العِلم أنّه بدون التفاعلات، تكون قدرة Lighthouse محدودة في ما يتعلّق بمدى قدرتها على التشخيص.

التحليل في الوقت الفعلي باستخدام شاشة المقاييس المباشرة في "أدوات مطوري البرامج في Chrome"

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

عرض المقاييس المباشرة في لوحة "الأداء" في "أدوات مطوّري البرامج في Chrome"
عرض المقاييس المباشرة في لوحة الأداء في "أدوات مطوّري البرامج في Chrome"

على الرغم من أنّ طريقة العرض هذه تقدّم الكثير من المعلومات المفيدة للمساعدة في تحديد مشاكل الأداء، يمكنك التوغّل في التفاصيل باستخدام التتبّع للحصول على مزيد من المعلومات.

التوغّل في التفاصيل باستخدام لوحة "الأداء"

تتيح لك لوحة "الأداء" في أدوات مطوّري البرامج في Chrome تسجيل ملف شخصي (أو تتبُّع) لجميع سلوكيات الصفحة خلال فترة زمنية مسجّلة.

تتبُّع لوحة الأداء في "أدوات مطوري البرامج في Chrome" يعرض رسمًا بيانيًا اشتقاقيًا مع تمييز مهمة طويلة
تتبُّع لوحة الأداء في "أدوات مطوّري البرامج في Chrome"

يتم عرض المخططات الزمنية الرئيسية، مثل LCP، في مسار "المخططات الزمنية". انقر على هذه الروابط للحصول على مزيد من التفاصيل.

يُبرز تتبُّع متغيّرات التصميم متغيّرات التصميم، ويؤدي النقر عليها إلى تقديم مزيد من التفاصيل حول العناصر التي تم تغييرها لتصحيح أخطاء متغيّرات التصميم التراكمية (CLS).

يتم أيضًا تمييز "المهام الطويلة" (التي يمكن أن تؤدي إلى مشاكل في INP) بمثلثات حمراء.

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

تصحيح أخطاء "مؤشرات أداء الويب الأساسية" في الميدان

لا يمكن أن تحدّد الأدوات الاختبارية دائمًا سبب جميع مشاكل Core Web Vitals التي تؤثر في المستخدمين. وهذا هو أحد الأسباب التي تجعل من المهم جمع بياناتك الميدانية، لأنّها تأخذ في الاعتبار عوامل لا يمكن للبيانات المخبرية أخذها في الاعتبار.

راجِع مقالة تصحيح الأخطاء في الحقل للحصول على مزيد من المعلومات.

الخطوة 3: مراقبة التغييرات

مجموعة من رموز أدوات Google من اليمين إلى اليسار، تعبّر الرموز عن "CrUX على BigQuery"، و"CrUX API"، و"PSI API"، و"web-vitals.js"، و"Lighthouse CI" في أقصى اليسار.
أدوات Google لمراقبة التغييرات

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

مراقبة طلبات الأداء في بيئات التكامل المستمر (CI)

يتيح لك Lighthouse-CI إجراء عمليات تدقيق Lighthouse تلقائيًا في عمليات الالتزام بالرموز لمنع تدهور الأداء عند إدخال الرمز. يمكن أن يتحقّق هذا من أوقات الأداء (التي تخضع للتباين)، أو عمليات تدقيق الأداء فقط، كأداة فحص لغرض منع الممارسات السيئة في الرمز البرمجي.

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

بالنسبة إلى المواقع الإلكترونية التي لا تتضمّن حلّاً لرصد الزيارات من مصادر غير معروفة، يمكنك استخدام لوحة بيانات CrUX كتحليل أساسي للمؤشرات في بيانات الحقل. ويعرض التقرير ما يلي للمواقع الإلكترونية في CrUX:

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

تستند لوحة بيانات CrUX إلى مجموعة بيانات CrUX في BigQuery التي يتم تعديلها مرة واحدة في الشهر. يمكن أن يكون هذا تذكيرًا جيدًا للتحقّق بانتظام من "مؤشرات أداء الويب الأساسية".

الخاتمة

لضمان تقديم تجارب سريعة وممتعة للمستخدمين، يجب التركيز على الأداء أولاً واعتماد سير عمل لضمان تحقيق التقدّم. من خلال الأدوات والعمليات المناسبة للتدقيق وتصحيح الأخطاء والمراقبة، يمكنك تقديم تجربة رائعة للمستخدمين والالتزام بالحدود المعمول بها لوضع "مؤشرات أداء الويب الأساسية" الجيدة.