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

Jeremy Wagner

Barry Pollard

تاريخ النشر: 6 مايو 2022، تاريخ آخر تعديل: 9 سبتمبر 2025

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

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

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

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

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

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

ما هو مؤشر INP؟

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

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

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

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

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

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

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

ما المقصود بالتفاعل؟

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

في ما يتعلّق بأهداف مقياس INP، يتم رصد أنواع التفاعلات التالية فقط:

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

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

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

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

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

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

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

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

ماذا يحدث إذا لم يتم تسجيل أي قيمة لتفاعل INP؟

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

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

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

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

في الحقل

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

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

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

في المختبر

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

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

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

قياس مقياس INP في JavaScript

لقياس INP في JavaScript، عليك قياس أوقات الأحداث لجميع التفاعلات، ثم احتساب النسبة المئوية الـ 98 لجميع هذه التفاعلات عند إلغاء تحميل الصفحة. يمكنك الرجوع إلى رمز مصدر مكتبة JavaScript web vitals الذي يتضمّن عملية تنفيذ مرجعية حول كيفية احتساب مقياس INP.

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

الاختلافات بين المقياس وواجهة برمجة التطبيقات

• لا يتم تلقائيًا تسجيل إدخالات event التي تقلّ مدتها عن 104 ملي ثانية باستخدام أدوات مراقبة الأداء. يمكن تغيير القيمة التلقائية عند تسجيل مراقب الأداء باستخدام المَعلمة durationThreshold، ولكن حتى هذه القيمة لها حدّ أدنى يبلغ 16 ملي ثانية. لهذا السبب، يُنصح أيضًا بمراقبة الإدخال first-input، وهو أيضًا إدخال "توقيت الحدث"، ولكن من المضمون أن يكون قابلاً للمراقبة حتى عندما تكون مدته أقل من durationThreshold. يساعد ذلك في ضمان أن تسجّل الصفحات التي تتضمّن تفاعلات دائمًا بعض قيم INP.
• يتطلّب احتساب النسبة المئوية بشكلٍ مثالي من الناحية الفنية الاحتفاظ بجميع العيّنات في الذاكرة، ما قد يكون مكلفًا. ولكن يمكنك تقريب النسب المئوية، خاصةً النسب المئوية العالية جدًا مثل p98، من خلال الاحتفاظ بقائمة صغيرة فقط تضم أسوأ N تفاعلات. ‫10 هو خيار شائع.
• إذا تمت استعادة صفحة من ذاكرة التخزين المؤقت للصفحات، يجب إعادة ضبط قيمة INP إلى صفر لأنّ المستخدمين يعتبرون ذلك زيارة منفصلة للصفحة.
• لا تعرض واجهة برمجة التطبيقات إدخالات event للتفاعلات التي تحدث داخل إطارات iframe، ولكن يعرض المقياس هذه الإدخالات لأنّها جزء من تجربة المستخدم على الصفحة. يمكن أن يظهر ذلك كفرق بين CrUX وRUM. للقياس السليم لمؤشر INP، عليك أخذ هذه التفاعلات في الاعتبار. يمكن أن تستخدم الإطارات الفرعية واجهة برمجة التطبيقات لإرسال إدخالات event-timing إلى الإطار الرئيسي.

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

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

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

بدلاً من حفظ كل هذه الحالات والتعامل معها بنفسك، يمكن للمطوّرين استخدام web-vitals مكتبة JavaScript لقياس مقياس INP، الذي يراعي كل ما ذُكر سابقًا، باستثناء حالة iframe:

import {onINP} from 'web-vitals';

// Measure and log INP in all situations
// where it needs to be reported.
onINP(console.log);

كيفية تحسين INP

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

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

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

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

إذا كانت لديك ملاحظات حول هذه المقاييس، يُرجى تقديمها في مجموعة Google الخاصة بملاحظات حول "مؤشرات Core Web Vitals".

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