مدى استجابة الصفحة لتفاعلات المستخدم (INP)

دعم المتصفح

  • Chrome: 96
  • الحافة: 96.
  • Firefox: غير مدعوم.
  • Safari: غير متوافق

المصدر

تُظهر بيانات استخدام Chrome أنّ %90 من وقت المستخدِم على الصفحة يتم قضاءه بعد تحميلها، لذا من المهم قياس وقت الاستجابة بعناية خلال دورة حياة الصفحة. وهذا ما يقيسه مقياس INP.

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

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

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

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

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

يشرح هذا الدليل آلية عمل مؤشر INP وكيفية قياسه ويشير إلى مراجع لتحسينه.

ما هو برنامج INP؟

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

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

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

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

التفاعل هو مجموعة من معالجات الأحداث التي يتم تشغيلها أثناء إيماءة المستخدم المنطقية نفسها. على سبيل المثال، تشمل التفاعلات من خلال "النقر" على جهاز يعمل باللمس أحداثًا متعددة، مثل pointerup وpointerdown وclick. يمكن أن يكون التفاعل مستندًا إلى JavaScript أو CSS أو عناصر التحكّم المدمجة في المتصفّح (مثل عناصر النماذج) أو مزيج من هذه العناصر.

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

ما هي نتيجة INP الجيدة؟

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

لضمان تقديم تجارب مستخدمين تتضمّن استجابة جيدة، يمكنك قياس الشريحة المئوية الخامسة والسبعين من عمليات تحميل الصفحات المسجّلة في الميدان، مقسّمة على الأجهزة الجوّالة وأجهزة الكمبيوتر المكتبي:

  • إذا كانت قيمة مقياس INP أقل من 200 ملي ثانية أو تساويها، يعني ذلك أنّ الصفحة سريعة الاستجابة.
  • إذا كان مقياس INP أعلى من 200 ملّي ثانية أو أقل أو أقل من 500 ملّي ثانية، يعني هذا أنّ استجابة الصفحة بحاجة إلى تحسين.
  • إذا كان مقياس INP أعلى من 500 ملي ثانية، يعني ذلك أنّ الصفحة بطيئة الاستجابة.
تكون قيم INP الجيدة 200 ملي ثانية أو أقل، وتكون القيم السيئة أكبر من 500 ملي ثانية، وأي قيمة بين القيمتين تحتاج إلى تحسين.
تبلغ قيم INP الجيدة 200 ملّي ثانية أو أقل. وتكون القيم السيئة أكبر من 500 ملي ثانية.

ما هي التفاعلات؟

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

غالبًا ما يكون JavaScript هو العامل الأساسي في التفاعل، على الرغم من أنّ المتصفّحات توفّر تفاعلاً من خلال عناصر التحكّم التي لا تعمل باستخدام JavaScript، مثل مربّعات الاختيار وأزرار الاختيار وعناصر التحكّم التي تعمل باستخدام CSS.

وفقًا لأغراض مقياس INP، لا يتم رصد سوى أنواع التفاعلات التالية:

  • النقر باستخدام الماوس
  • النقر على جهاز مزوّد بشاشة تعمل باللمس
  • الضغط على مفتاح في لوحة مفاتيح خارجية أو لوحة مفاتيح تظهر على الشاشة

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

يمكن أن تتألف التفاعلات من أحداث متعددة. على سبيل المثال، تتضمّن ضغطة المفتاح الأحداث keydown وkeypress وkeyup. انقر على التفاعلات التي تحتوي على حدثَي pointerup وpointerdown. فالحدث ذو أطول مدة ضمن التفاعل هو ما يساهم في إجمالي وقت الاستجابة للتفاعل.

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

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

ما هو الفرق بين مقياس INP ومقياس مهلة الاستجابة لأوّل إدخال (FID)؟

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

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

ماذا يحدث إذا لم يتم الإبلاغ عن أي قيمة INP؟

من الممكن أن تعرض إحدى الصفحات أي قيمة INP. يمكن أن يحدث ذلك لعدد من الأسباب، بما في ذلك ما يلي:

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

كيفية قياس مدى استجابة الصفحة لتفاعلات المستخدم

يمكن قياس INP في كلّ من الميدان والمختبر، إلى الحدّ الذي يمكنك فيه محاكاة تفاعلات المستخدمين الواقعية.

في المجال

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

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

ومع أنّ CrUX يمكنه إعلامك إذا كانت هناك مشكلة، لا يمكنه إعلامك بسبب المشكلة. يمكن أن يساعدك حلّ RUM في اكتشاف المزيد من التفاصيل حول الصفحات أو المستخدِمين أو تفاعلات المستخدِمين التي تواجه مشاكل في الاستجابة. إنّ القدرة على تحديد INP استنادًا إلى التفاعلات الفردية تتجنّب التخمين والجهد المبذول.

في المختبر

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

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

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

كيفية تحسين مقياس INP

تتوفّر مجموعة من الأدلة حول تحسين INP لإرشادك خلال عملية تحديد التفاعلات البطيئة في المجال، واستخدام البيانات المختبرية لمساعدتك في تحديد الأسباب وتحسينها.

سجلّ التغييرات

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

لمساعدتك في إدارة ذلك، سيتم عرض جميع التغييرات التي تطرأ على تنفيذ هذه المقاييس أو تعريفها في سجلّ التغييرات هذا.

إذا كانت لديك ملاحظات حول هذه المقاييس، يُرجى تقديمها في مجموعة web-vitals-feedback على Google.

اختبِر معلوماتك

ما هو الهدف الأساسي لمقياس INP؟

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

أي من أنواع التفاعل التالية تتم ملاحظتها لأغراض حساب INP؟ (اختَر كلّ الإجابات المناسبة)

الضغط على مفتاح في لوحة مفاتيح
التكبير أو التصغير في الصفحة
تمرير مؤشر الماوس فوق العناصر
النقر باستخدام الماوس
الانتقال للأعلى أو للأسفل في الصفحة باستخدام عجلة الماوس أو لوحة اللمس
النقر على شاشة تعمل باللمس

كيف يتم تحديد "وقت الاستجابة" لتفاعل مع مقياس مدى استجابة الصفحة لتفاعلات المستخدم (INP)؟

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

ما الفرق بين INP وFID؟

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

في أي ظروف قد تكون بيانات INP غير متاحة لصفحة في أدوات مثل "إحصاءات PageSpeed"؟

تم إنشاء الصفحة باستخدام إطار عمل يُحسِّن المحتوى تلقائيًا لتحسين تجربة المستخدم، لذا لا داعي للإبلاغ عنها.
تفاعل المستخدمون مع الصفحة فقط من خلال التمرير والتمرير، ولا يُعتبَر ذلك من مقياس INP.
تستخدِم الصفحة مكتبة لقياس أداء مخصّصة لا تسجِّل بيانات INP.
لا تتوفّر بيانات تفاعل كافية من مستخدمي Chrome لاحتساب قيمة INP ذات مغزى في مجموعة بيانات CrUX.

ما هي الاستراتيجية الأكثر فعالية لإعادة إنتاج التفاعلات البطيئة في بيئة معملية؟

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

تم إنشاء هذا الاختبار من خلال Gemini 1.5 وراجعه فريق المراجعين. مشاركة ملاحظاتك