دادههای استفاده از کروم نشان میدهد که ۹۰٪ از زمان کاربر در یک صفحه پس از بارگیری آن صرف میشود، بنابراین، اندازهگیری دقیق پاسخدهی در طول چرخه عمر صفحه مهم است. این چیزی است که متریک INP ارزیابی می کند.
پاسخگویی خوب به این معنی است که یک صفحه به سرعت به تعاملات ایجاد شده با آن پاسخ می دهد. هنگامی که یک صفحه به یک تعامل پاسخ می دهد، نتیجه بازخورد بصری است که توسط مرورگر در فریم بعدی که مرورگر ارائه می دهد ارائه می شود. بازخورد بصری به شما میگوید که آیا، برای مثال، کالایی که به یک سبد خرید آنلاین اضافه میکنید، واقعاً اضافه میشود، آیا منوی پیمایش تلفن همراه باز شده است، آیا محتوای فرم ورود توسط سرور تأیید میشود و غیره.
برخی از تعاملات به طور طبیعی بیشتر از سایرین طول می کشد، اما برای تعاملات پیچیده، بسیار مهم است که به سرعت برخی بازخوردهای بصری اولیه را به عنوان نشانه ای به کاربر نشان دهیم که چیزی در حال رخ دادن است. زمان تا رنگ بعدی اولین فرصت برای انجام این کار است. بنابراین، هدف INP اندازهگیری تمام اثرات نهایی تعامل (مانند واکشی شبکه و بهروزرسانیهای رابط کاربری از سایر عملیات ناهمزمان) نیست، بلکه زمانی است که رنگ بعدی مسدود میشود. با تأخیر در بازخورد بصری، ممکن است به کاربران این تصور را القا کنید که صفحه به اقدامات آنها پاسخ نمی دهد.
هدف INP این است که اطمینان حاصل شود که از زمانی که کاربر یک تعامل را آغاز میکند تا زمانی که فریم بعدی نقاشی میشود، برای همه یا بیشتر تعاملهایی که کاربر انجام میدهد، تا حد امکان کوتاه باشد.
در ویدیوی زیر، مثال سمت راست بازخورد بصری فوری را نشان می دهد که آکاردئون در حال باز شدن است. همچنین نشان میدهد که چگونه پاسخدهی ضعیف میتواند باعث پاسخهای ناخواسته متعدد به ورودی شود، زیرا کاربر فکر میکند تجربه شکسته است.
این مقاله نحوه عملکرد INP، نحوه اندازه گیری آن را توضیح می دهد و به منابعی برای بهبود آن اشاره می کند.
INP چیست؟
INP معیاری است که پاسخگویی کلی صفحه به تعاملات کاربر را با مشاهده تأخیر کلیه تعاملات کلیک، ضربه و صفحه کلید که در طول عمر بازدید کاربر از یک صفحه رخ می دهد، ارزیابی می کند. مقدار نهایی INP طولانی ترین برهمکنش مشاهده شده است، بدون توجه به نقاط پرت.
همانطور که در بالا گفته شد، INP با مشاهده تمام تعاملات انجام شده با یک صفحه محاسبه می شود. برای اکثر سایتها، تعامل با بدترین تأخیر به عنوان INP گزارش میشود. با این حال، برای صفحاتی که تعداد تعاملات زیادی دارند، سکسکههای تصادفی میتوانند منجر به یک تعامل غیرمعمول بالا در سایتهایی شود که در غیر این صورت پاسخگو هستند. هر چه تعاملات بیشتر باشد، احتمال وقوع آن بیشتر است. برای مقابله با این، و اندازه گیری بهتری از پاسخگویی واقعی برای آن نوع صفحات، یک بالاترین تعامل را برای هر 50 تعامل نادیده می گیریم. اکثریت قریب به اتفاق تجربههای صفحه بیش از 50 تعامل ندارند، بنابراین بدترین تعامل را گزارش میکنند. سپس صدک 75 از تمام بازدیدهای صفحه طبق معمول گزارش میشود، که بیشتر موارد پرت را حذف میکند تا مقداری را ارائه دهد که اکثریت قریب به اتفاق کاربران یا بهتر آن را تجربه میکنند.
تعامل گروهی از کنترلکنندههای رویداد است که در طول یک حرکت منطقی کاربر فعال میشوند. برای مثال، فعل و انفعالات «ضربه» روی یک دستگاه صفحه لمسی شامل چندین رویداد مانند pointerup ، pointerdown و click است. یک تعامل می تواند توسط جاوا اسکریپت، CSS، کنترل های داخلی مرورگر (مانند عناصر فرم)، یا ترکیبی از آنها هدایت شود.
تأخیر تعامل شامل طولانیترین مدت زمان گروهی از کنترلکنندههای رویداد است که تعامل را هدایت میکند، از زمانی که کاربر تعامل را آغاز میکند تا زمانی که فریم بعدی با بازخورد بصری ارائه میشود.
نمره INP خوب چیست؟
سنجاق کردن برچسب هایی مانند "خوب" یا "ضعیف" در یک معیار پاسخگویی دشوار است. از یک طرف، شما می خواهید شیوه های توسعه ای را تشویق کنید که پاسخگویی خوب را در اولویت قرار می دهند. از سوی دیگر، باید این واقعیت را در نظر بگیرید که تنوع قابل توجهی در قابلیتهای دستگاههایی وجود دارد که مردم برای تعیین انتظارات توسعه قابل دستیابی استفاده میکنند.
برای اطمینان از ارائه تجربیات کاربر با پاسخگویی خوب، یک آستانه خوب برای اندازه گیری صدک 75 بارگیری صفحه ثبت شده در این زمینه است که در دستگاه های تلفن همراه و دسکتاپ تقسیم بندی شده است:
- INP زیر یا در 200 میلی ثانیه به این معنی است که صفحه شما پاسخگویی خوبی دارد.
- INP بالاتر از 200 میلی ثانیه و کمتر یا در 500 میلی ثانیه به این معنی است که پاسخگویی صفحه شما نیاز به بهبود دارد .
- INP بالای 500 میلی ثانیه به این معنی است که صفحه شما پاسخگویی ضعیفی دارد.
چه چیزی در یک تعامل وجود دارد؟
محرک اصلی تعامل اغلب جاوا اسکریپت است، اگرچه مرورگرها تعامل را از طریق کنترل هایی که توسط جاوا اسکریپت پشتیبانی نمی شوند، مانند چک باکس ها، دکمه های رادیویی، و کنترل هایی که توسط CSS ارائه می شوند، ارائه می دهند.
تا آنجا که INP پیش می رود، فقط انواع تعامل زیر مشاهده می شود:
- کلیک کردن با ماوس.
- ضربه زدن بر روی دستگاه دارای صفحه لمسی.
- فشار دادن یک کلید روی صفحه کلید فیزیکی یا صفحه کلید.
فعل و انفعالات در سند اصلی یا در فریم های تعبیه شده در سند رخ می دهد - برای مثال کلیک کردن روی پخش روی یک ویدیوی جاسازی شده. کاربران نهایی نمی دانند که در iframe چه چیزی وجود دارد یا خیر. بنابراین، INP در iframes برای اندازهگیری تجربه کاربر برای صفحه سطح بالا مورد نیاز است. توجه داشته باشید APIهای وب جاوا اسکریپت به محتویات iframe دسترسی نخواهند داشت، بنابراین ممکن است نتوانند INP را در یک iframe اندازه گیری کنند و این به عنوان تفاوت بین CrUX و RUM نشان داده می شود.
فعل و انفعالات ممکن است از دو بخش تشکیل شده باشد که هر کدام دارای چندین رویداد است. به عنوان مثال، یک ضربه کلید شامل رویدادهای keydown ، keypress ، و keyup است. فعل و انفعالات ضربهای حاوی رویدادهای pointerup و pointerdown هستند. رویدادی با طولانیترین مدت در تعامل به عنوان تأخیر تعامل انتخاب میشود.
INP زمانی محاسبه میشود که کاربر صفحه را ترک میکند و در نتیجه یک مقدار واحد به دست میآید که نشاندهنده پاسخگویی کلی صفحه در کل چرخه عمر صفحه است. INP پایین به این معنی است که یک صفحه به طور قابل اعتمادی به ورودی کاربر پاسخ می دهد.
INP چه تفاوتی با تاخیر ورودی اول (FID) دارد؟
در جایی که INP تمام تعاملات صفحه را در نظر می گیرد، تاخیر ورودی اول (FID) فقط اولین تعامل را به حساب می آورد. همچنین فقط تأخیر ورودی اولین تعامل را اندازهگیری میکند، نه زمان لازم برای اجرای کنترلکنندههای رویداد یا تأخیر در ارائه فریم بعدی.
با توجه به اینکه FID همچنین یک معیار پاسخگویی بار است، منطق پشت آن این است که اگر اولین تعاملی که با یک صفحه در مرحله بارگذاری انجام میشود، تاخیر ورودی کمی داشته باشد، صفحه اولین تاثیر خوبی را ایجاد کرده است.
INP چیزی بیشتر از برداشت های اولیه است. با نمونه برداری از تمام تعاملات، پاسخگویی را می توان به طور جامع ارزیابی کرد، و INP را به شاخص قابل اعتمادتری برای پاسخگویی کلی نسبت به FID تبدیل می کند.
اگر مقدار INP گزارش نشود چه؟
این امکان وجود دارد که یک صفحه نتواند مقدار INP را برگرداند. این ممکن است به دلایل مختلفی اتفاق بیفتد:
- صفحه بارگیری شد، اما کاربر هرگز روی صفحهکلید خود کلیک، ضربه یا فشار نداد.
- صفحه بارگیری شد، اما کاربر با استفاده از حرکاتی که شامل کلیک کردن، ضربه زدن یا استفاده از صفحه کلید نبود، با صفحه تعامل داشت. به عنوان مثال، پیمایش یا نگه داشتن ماوس روی عناصر در نحوه محاسبه INP نقشی ندارد.
- این صفحه توسط یک ربات مانند یک خزنده جستجو یا مرورگر بدون سر که برای تعامل با صفحه اسکریپت نشده است، قابل دسترسی است.
نحوه اندازه گیری INP
INP را می توان هم در میدان و هم در آزمایشگاه از طریق ابزارهای مختلف اندازه گیری کرد.
در میدان
در حالت ایده آل، سفر شما در بهینه سازی INP با داده های میدانی آغاز می شود. در بهترین حالت، دادههای میدانی از مانیتورینگ کاربر واقعی (RUM) نه تنها مقدار INP صفحه را به شما میدهد، بلکه دادههای متنی را نیز در اختیار شما قرار میدهد که نشان میدهد چه تعامل خاصی مسئول مقدار INP بوده است، خواه این تعامل در حین بارگذاری یا پس از بارگذاری صفحه رخ داده باشد. نوع تعامل (کلیک، فشار کلید، یا ضربه زدن) و سایر اطلاعات ارزشمند.
اگر وبسایت شما واجد شرایط گنجاندن در گزارش تجربه کاربر Chrome (CrUX) باشد، میتوانید به سرعت دادههای میدانی برای INP از طریق CrUX در PageSpeed Insights (و سایر موارد حیاتی وب اصلی) دریافت کنید. حداقل می توانید یک تصویر در سطح مبدا از INP وب سایت خود دریافت کنید، اما در برخی موارد، می توانید داده های سطح صفحه را نیز دریافت کنید.
با این حال، در حالی که CrUX برای اینکه به شما بگوید مشکلی در سطح بالایی وجود دارد مفید است، اغلب جزئیات کافی برای کمک به درک کامل مشکل ارائه نمی دهد. یک راه حل RUM می تواند به شما کمک کند تا جزئیات بیشتری را در مورد صفحات، کاربران یا تعاملات کاربر که تعاملات آهسته ای را تجربه می کنند، بررسی کنید. توانایی نسبت دادن INP به تعاملات فردی از حدس و گمان و تلاش بیهوده جلوگیری می کند.
در آزمایشگاه
در حالت مطلوب، زمانی که دادههای میدانی به دست آوردید که نشان میدهد تعاملات آهستهای دارید، میخواهید آزمایش را در آزمایشگاه شروع کنید. با این حال، در غیاب دادههای میدانی، راهبردهایی برای بازتولید برهمکنشهای آهسته در آزمایشگاه وجود دارد. چنین استراتژیهایی شامل دنبال کردن جریانهای مشترک کاربر و آزمایش تعاملات در طول مسیر، و همچنین تعامل با صفحه در حین بارگذاری - زمانی که رشته اصلی اغلب شلوغترین است - به منظور آشکارسازی تعاملات آهسته در طول آن بخش حیاتی از تجربه کاربر است.
نحوه بهبود INP
مجموعه ای از راهنماهای بهینه سازی INP در دسترس است تا شما را در فرآیند شناسایی تعاملات کند در میدان و استفاده از داده های آزمایشگاهی برای بررسی و بهینه سازی آنها به روش های مختلف راهنمایی کند.
تغییرات
گاهی اوقات، اشکالاتی در APIهای مورد استفاده برای اندازه گیری معیارها و گاهی اوقات در تعاریف خود معیارها کشف می شود. در نتیجه، گاهی اوقات باید تغییراتی ایجاد شود، و این تغییرات میتواند به صورت بهبود یا پسرفت در گزارشهای داخلی و داشبورد شما نشان داده شود.
برای کمک به شما در مدیریت این موضوع، همه تغییرات در اجرا یا تعریف این معیارها در این Changelog ظاهر میشود.
اگر بازخوردی برای این معیارها دارید، میتوانید آن را در گروه web-vitals-feedback Google ارائه کنید.