شاخص INP چیست؟ راهنمای کامل بهبود INP برای افزایش سرعت

طی سال‌های اخیر، گوگل برای ارزیابی کیفیت تجربه کاربران در وب‌سایت‌ها، مجموعه‌ای از معیارها با نام Core Web Vitals را معرفی کرده است. این معیارها به مدیران سایت کمک می‌کنند تا متوجه شوند که کاربران هنگام کار با صفحات مختلف چه تجربه‌ای دارند. در ابتدا یکی از مهم‌ترین معیارهای آن FID بود اما به‌مرور مشخص شد که این شاخص محدودیت‌هایی دارد و نمی‌تواند تمام تعاملات کاربران را به‌درستی اندازه‌گیری کند. به همین دلیل گوگل معیار جدیدی با نام معیار INP یا Interaction to Next Paint را معرفی کرد.

شاخص INP مدت زمانی را اندازه‌گیری می‌کند که از لحظه تعامل کاربر با صفحه (مانند کلیک یا لمس) تا زمان نمایش نتیجه آن، طول می‌کشد. هرچه مقدار شاخص INP کمتر باشد، یعنی سایت سریع‌تر به درخواست کاربران پاسخ می‌دهد و تجربه کاربری بهتری ارائه می‌کند.

در ادامه مقاله با مفهوم شاخص INP، نحوه عملکرد، اهمیت این معیار برای سئو و همچنین روش‌های اندازه‌گیری و بهبود آن برای افزایش سرعت پاسخگویی سایت آشنا خواهید شد.

تصویر(1)

INP یا Interaction to Next Paint چیست؟

الگوریتم Core Web Vitals یکی از معیارهای مهم گوگل برای ارزیابی کیفیت فنی وب‌سایت‌ها در نتایج جستجو است. این الگوریتم از چند شاخص مختلف تشکیل شده که هرکدام بخشی از تجربه کاربری را بررسی می‌کنند. یکی از جدیدترین معیارها، معیار INP می‌باشد که از مارس ۲۰۲۴ به‌صورت رسمی جایگزین FID گردیده است.

وظیفه اصلی شاخص INP اندازه‌گیری سرعت پاسخ‌دهی یک صفحه وب به تعاملات کاربر است. منظور از تعامل، اقداماتی می باشد که کاربر هنگام استفاده از سایت انجام می‌دهد و انتظار دارد بلافاصله نتیجه آن را مشاهده کند. گوگل این تعاملات که شامل موارد زیر می‌شود را به عنوان Input معرفی می‌نماید:

• کلیک با ماوس

• لمس صفحه در دستگاه‌های لمسی

• فشردن کلید در کیبورد فیزیکی یا مجازی

تصویر(2)

شاخص INP، فاصله زمانی بین انجام این تعاملات تا نمایش پاسخ بصری در صفحه را اندازه‌گیری می‌کند. برای مثال وقتی کاربری روی دکمه‌ای در سایت شما کلیک می‌نماید، مدت زمانی که طول می‌کشد تا نتیجه آن عمل روی صفحه ظاهر شود در شاخص مذکور ثبت خواهد شد.

تفاوت مهم شاخص INP با معیار قدیمی FID این است که FID فقط اولین تعامل کاربر را بررسی می‌کرد اما شاخص فوق تمام تعاملات کاربر طی حضور او درون صفحه را در نظر می‌گیرد. به همین دلیل این معیار تصویر دقیق‌تری از عملکرد واقعی سایت ارائه می‌دهد.

در بسیاری از مواقع، عامل اصلی تأخیر پاسخ‌دهی صفحات وب، کدهای JavaScript هستند. این کدها باید درخواست کاربر را پردازش کرده و نتیجه را به مرورگر نمایش دهند. اگر این فرآیند زمان‌بر باشد، مقدار شاخص INP افزایش پیدا می‌کند و تجربه کاربری ضعیف‌تری ایجاد می‌شود.

همچنین عملکرد سرور و کیفیت هاست نیز می‌تواند روی معیار INP تأثیر بگذارد. استفاده از هاست سریع و بهینه، باعث می‌شود درخواست‌ها سریع‌تر پردازش گردیده و پاسخ در زمان کوتاه‌تری به کاربر نمایش داده شود.

شاخص INP چگونه کار می‌کند؟

هدف اصلی شاخص INP این است که سایت در سریع‌ترین زمان ممکن به تعامل کاربر با صفحه واکنش نشان دهد. بهتر است حتی اگر نمایش کامل محتوا زمانبر باشد، با استفاده از نشانه‌های بصری مانند لودینگ یا انیمیشن، به کاربر اطلاع داده شود که درخواست او در حال پردازش است.

تصویر(3)

در انیمیشن سمت چپ، واکنش صفحه چندان مناسب نیست زیرا زمانی که کاربر روی صفحه گوشی خود ضربه می‌زند، در ابتدا هیچ نشانه‌ای از انجام درخواست دیده نمی‌شود و ناگهان تصویر پیش‌نمایش به رنگ سبز تغییر می‌کند. این موضوع باعث می‌شود کاربر تصور کند سایت به درخواست او پاسخی نداده است.

در مقابل، انیمیشن سمت راست عملکرد بهتری را نشان می‌دهد. در این حالت بلافاصله پس از تعامل کاربر، نشانه‌های بارگذاری نمایش داده می‌شوند و به کاربر اطلاع می‌دهند که درخواست او در حال پردازش است. در ادامه، زمانی که نسخه سبز رنگ پیراهن آماده می‌شود، تصویر نهایی روی صفحه اصلی نمایش داده خواهد شد.

برای درک بهتر عملکرد شاخص INP، مراحل زیر را در نظر بگیرید:

1. کاربر با صفحه تعامل برقرار می‌کند؛ برای مثال روی یک دکمه کلیک کرده یا صفحه را لمس می‌نماید.

2. مرورگر درخواست کاربر را برای دریافت اطلاعات جدید به سرور ارسال می‌کند.

3. سرور درخواست را پردازش کرده و داده‌های موردنیاز را به مرورگر برمی‌گرداند.

4. مرورگر نتیجه را به‌صورت بصری روی صفحه نمایش می‌دهد.

5. مدت زمانی که از لحظه تعامل تا نمایش پاسخ طول کشیده، به‌عنوان مقدار شاخص INP ثبت می‌شود.

هرچه زمان ثبت‌شده در شاخص INP کمتر باشد، عملکرد سایت بهتر ارزیابی می‌شود. در واقع عدد پایین‌تر در معیار INP نشان می‌دهد که صفحه وب سریع‌تر به تعاملات کاربران پاسخ خواهد داد.

تاثیر INP بر سئو 

اهمیت شاخص INP زمانی مشخص می‌شود که از دید سئو و تجربه کاربری بررسی گردد. این معیار مستقیماً نشان می‌دهد که کاربران هنگام استفاده از سایت شما با چه سرعتی پاسخ تعاملات خود را دریافت می‌کنند.

بهبود شاخص INP معمولاً به معنای سریع‌تر شدن عملکرد سایت است. زمانی که صفحات وب سریع‌تر واکنش نشان دهند، کاربران تجربه بهتری خواهند داشت و احتمال ماندن آنها در سایت افزایش پیدا می‌کند. در نتیجه رضایت کاربران بیشتر می‌شود و تجربه کاربری (UX) بهبود پیدا خواهد کرد.

از طرف دیگر، گوگل نیز به این موضوع توجه ویژه‌ای دارد. از این رو شاخص INP به‌عنوان یکی از معیارهای مهم در ارزیابی کیفیت صفحات در نظر گرفته شده است. بهبود معیار INP می‌تواند به ارتقا جایگاه سایت در نتایج جستجو کمک کند زیرا گوگل سایت‌هایی را ترجیح می‌دهد که تجربه کاربری سریع و روانی ارائه دهند. در ادامه به مهم‌ترین اثرات شاخص INP بر عملکرد سایت اشاره شده است:

۱. کاهش نرخ پرش کاربران

یکی از مهم‌ترین معیارهای بررسی رفتار کاربران در سایت، Bounce Rate یا نرخ پرش است. این شاخص تعداد بازدیدکنندگانی را نشان می‌دهد که پس از ورود به سایت بدون انجام تعامل خاصی آن را ترک می‌کنند.

وقتی شاخص INP در یک سایت مقدار مناسبی داشته باشد، یعنی صفحات سریعا به درخواست کاربران واکنش نشان می‌دهند. در چنین شرایطی کاربران کمتر دچار سردرگمی یا انتظار طولانی می‌شوند و احتمال خروج سریع از سایت کاهش پیدا می‌کند. در نتیجه با بهبود شاخص INP، نرخ پرش کاهش یافته و شانس سایت برای کسب رتبه بهتر در نتایج جستجوی گوگل افزایش پیدا خواهد کرد.

۲. بهبود جایگاه سایت در نتایج جستجو

با توجه به اینکه شاخص INP بخشی از مجموعه Core Web Vitals محسوب می‌شود، نقش مهمی در ارزیابی کیفیت صفحات توسط گوگل دارد. موتور جستجو تلاش می‌کند سایت‌هایی را در رتبه‌های بالاتر نمایش دهد که تجربه کاربری بهتری ارائه می‌کنند.

بنابراین اگر شاخص INP سایت شما پایین باشد، یعنی تعامل کاربران با صفحات، سریع و روان انجام می‌شود. این موضوع می‌تواند به بهبود جایگاه سایت در نتایج جستجو کمک کند.

۳. افزایش نرخ تبدیل کاربران

هدف اصلی بسیاری از سایت‌ها در دنیای دیجیتال مارکتینگ تبدیل بازدیدکننده به مشتری است. این موضوع با عنوان Conversion Rate یا "نرخ تبدیل" شناخته می‌شود.

اگر شاخص INP سایت مقدار بالایی داشته باشد، کاربران هنگام تعامل با صفحات تأخیر خواهند داشت. این تأخیر ممکن است در بارگذاری تصاویر محصولات، باز شدن صفحات یا اجرای فرم‌ها دیده شود. در چنین شرایطی کاربران اعتماد کمتری به سایت پیدا می‌کنند و احتمال خرید یا ثبت‌نام کاهش می‌یابد.

در مقابل، بهینه‌سازی معیار INP باعث می‌شود صفحات سریع‌تر واکنش نشان دهند و کاربران تجربه روان‌تری داشته باشند. همین موضوع می‌تواند نقش مهمی در افزایش نرخ تبدیل و موفقیت کسب‌وکار آنلاین ایفا کند.

عدد مناسب برای شاخص INP چقدر است؟

بر اساس راهنمای رسمی گوگل، مقدار مناسب برای شاخص INP حدود ۲۰۰ میلی‌ثانیه یا کمتر در نظر گرفته می‌شود. اگر امتیاز سایت شما در این محدوده قرار داشته باشد، یعنی صفحه موردنظر به‌خوبی تعامل کاربران را پاسخ می‌دهد.

وضعیت‌های مختلف شاخص INP معمولاً به شکل زیر دسته‌بندی می‌شود:

• کمتر از ۲۰۰ میلی‌ثانیه: وضعیت بسیار خوب

• بین ۲۰۰ تا ۵۰۰ میلی‌ثانیه: نیاز به بهبود

• بیشتر از ۵۰۰ میلی‌ثانیه: عملکرد ضعیف

وقتی شاخص INP از ۵۰۰ میلی‌ثانیه بیشتر شود، کاربران هنگام کار با سایت تأخیر قابل‌توجهی احساس می‌کنند و احتمال ترک سریع صفحه افزایش پیدا می‌یابد.

 پیش از معرفی شاخص INP، گوگل معیاری به نام FID یا First Input Delay را برای اندازه‌گیری سرعت تعامل صفحات استفاده می‌کرد. این شاخص فقط مدت زمان تأخیر بین اولین تعامل کاربر با سایت و پاسخ مرورگر را بررسی می‌نمود.

به عبارت دیگر، FID تنها اولین اقدام کاربر را اندازه می‌گرفت اما معیار INP رویکرد کامل‌تری داشته و تمام تعاملات کاربر در طول حضور او درون صفحه را بررسی می‌کند. به همین دلیل شاخص INP اطلاعات دقیق‌تر و واقع‌بینانه‌تری درباره عملکرد سایت به توسعه‌دهندگان و مدیران سایت ارائه می‌دهد.

برای درک بهتر تفاوت این دو معیار، سناریوی زیر را در نظر بگیرید:

فرض کنید کاربری وارد سایت شما می‌شود. اولین کاری که انجام می‌دهد کلیک روی منوی سایت است تا بخش‌های مختلف را مشاهده کند. این فرآیند تنها ۱۰۰ میلی‌ثانیه زمان می‌برد. سپس همین کاربر روی لینک بلاگ کلیک می‌کند و بارگذاری این صفحه ۴۰۰ میلی‌ثانیه طول می‌کشد.

در این مثال FID فقط تعامل اول یعنی ۱۰۰ میلی‌ثانیه را ثبت می‌کند، در صورتی که شاخص INP تمام تعاملات را بررسی کرده و مقدار ۴۰۰ میلی‌ثانیه را به عنوان بدترین زمان تعامل در نظر می‌گیرد. به همین دلیل است که معیار INP معیار دقیق‌تری برای بررسی تجربه واقعی کاربران محسوب می‌شود.

روش‌های اندازه‌گیری شاخص INP

 با توجه به تاثیر INP بر سئو، برای بررسی شاخص INP ابزارهای مختلفی وجود دارد. برخی از این ابزارها رایگان هستند و برخی دیگر امکانات پیشرفته‌تری در نسخه‌های پولی ارائه می‌دهند. این ابزارها معمولاً علاوه بر معیار INP سایر معیارهای Core Web Vitals را نیز بررسی می‌کنند.

۱. Google PageSpeed Insights

یکی از شناخته‌شده‌ترین ابزارهای بررسی عملکرد سایت، Google PageSpeed Insights است. این ابزار رایگان به شما کمک می‌کند وضعیت فنی سایت خود را بررسی کرده و پیشنهادهایی برای بهبود عملکرد آن دریافت کنید.

با استفاده از این ابزار می‌توانید سرعت بارگذاری صفحات را در دستگاه‌های موبایل و دسکتاپ مشاهده کنید و همچنین اطلاعات دقیقی درباره معیار INP و سایر معیارهای Core Web Vitals به دست آورید.

PageSpeed Insights دو نوع داده مختلف ارائه می‌دهد. در بخش “Discover what your real users are experiencing” اطلاعات واقعی کاربران مرورگر کروم نمایش داده می‌شود. این داده‌ها از گزارش Chrome UX استخراج شده و نشان می‌دهند کاربران واقعی هنگام استفاده از سایت شما چه تجربه‌ای دارند.

در این قسمت، معیارهایی مانند شاخص INP به‌همراه سایر فاکتورهای عملکردی سایت نمایش داده می‌شود و می‌توانید وضعیت واقعی تعامل کاربران با صفحات خود را بررسی کنید.

تصویر(4)

در ابزار PageSpeed Insights بخشی با عنوان “Diagnose performance issues” وجود دارد که در آن می‌توان اطلاعات مربوط به شاخص INP و سایر معیارهای Core Web Vitals را مشاهده کرد.

تصویر(5)

گاهی ممکن است در این قسمت داده‌ای برای شاخص INP نمایش داده نشود و پیامی مبنی بر در دسترس نبودن اطلاعات مشاهده کنید. در چنین شرایطی بهتر است معیار دیگری به نام TBT یا Total Blocking Time را بررسی نمایید. این شاخص مدت زمانی را اندازه‌گیری خواهد کرد که در آن صفحه سایت هنگام بارگذاری، به تعاملات کاربر پاسخ نمی‌دهد.

هرچند TBT دقیقاً همان معیار INP نیست اما می‌تواند تا حدی وضعیت پاسخ‌دهی صفحه را نشان دهد. تفاوت مهم دو معیار در این است که TBT بر اساس داده‌های آزمایشگاهی و شبیه‌سازی تعامل کاربران محاسبه می‌شود، در حالی که شاخص INP بیشتر بر پایه داده‌های واقعی کاربران است.

در بخش‌های Opportunities و Diagnostics نیز پیشنهاداتی برای بهینه‌سازی عملکرد سایت ارائه می‌شود که می‌تواند به بهبود شاخص INP و دیگر معیارهای سئو کمک کند.

۲. ابزار SEMrush Site Audit

یکی دیگر از ابزارهای قدرتمند برای بررسی وضعیت فنی سایت، قابلیت Site Audit در پلتفرم Semrush است. این ابزار در میان متخصصان سئو محبوبیت زیادی داشته و می‌تواند بیش از ۱۴۰ مشکل فنی در یک وب‌سایت را شناسایی کند.

تصویر(6)

در گزارش این ابزار، اطلاعات مربوط به Core Web Vitals از جمله معیار INP نیز نمایش داده می‌شود. پس از اجرای فرآیند بررسی سایت که معمولاً در مدت کوتاهی انجام می‌گردد، گزارش‌های مختلفی در اختیار شما قرار می‌گیرد.

در بخش Thematic Reports می‌توانید قسمت Core Web Vitals را مشاهده کنید. با انتخاب گزینه View Details جزئیات بیشتری از وضعیت شاخص INP و سایر معیارهای عملکردی صفحه نمایش داده می‌شود.

تصویر(7)

همچنین در بخش Top Improvements پیشنهاداتی برای بهبود عملکرد سایت ارائه می‌شود که می‌توانند در کاهش مقدار شاخص INP و افزایش کیفیت تجربه کاربری مؤثر باشند.

۳. ابزار CrUX Dashboard

ابزار CrUX Dashboard یکی از منابع کاربردی برای تحلیل داده‌های واقعی کاربران است که در محیط Looker Studio ارائه می‌شود. Looker Studio همان نسخه جدید Google Data Studio می باشد که برای تحلیل و نمایش داده‌های آماری طراحی گردیده است.

برای استفاده از این ابزار می‌توانید آدرس سایت خود را در صفحه مربوطه وارد کرده و روی گزینه Go کلیک کنید. پس از آماده شدن گزارش، می‌توانید وضعیت تمام معیارهای Core Web Vitals همچون شاخص INP را مشاهده نمایید.

تصویر(8)

یکی از ویژگی‌های مهم ابزار CrUX Dashboard این است که اطلاعات مربوط به کاربران موبایل و دسکتاپ را به‌صورت جداگانه نمایش می‌دهد. علاوه بر این، CrUX Dashboard یک تاریخچه از داده‌ها ارائه می‌کند و به شما اجازه می‌دهد روند تغییرات شاخص INP سایت را در طول زمان بررسی کنید.

تصویر(9)

همین قابلیت باعث می‌شود تحلیل عملکرد سایت و شناسایی نقاط ضعف بسیار دقیق‌تر صورت گیرد.

۴. بررسی معیار INP در Google Search Console

یکی دیگر از منابع مهم برای تحلیل عملکرد صفحات، گزارش Core Web Vitals در Google Search Console است. این گزارش از داده‌های واقعی کاربران استفاده می‌کند و دید دقیقی از وضعیت سایت در اختیار مدیران وب‌سایت قرار می‌دهد. برای مشاهده این اطلاعات ابتدا وارد حساب کاربری خود در Search Console شوید و از منوی سمت چپ گزینه Core Web Vitals را انتخاب کنید.

تصویر(10)

در این بخش اطلاعات مربوط به عملکرد صفحات در دو دسته Mobile و Desktop نمایش داده می‌شود. برای بررسی دقیق‌تر شاخص INP در هرکدام از این دسته‌ها می‌توانید گزینه Open Report را انتخاب کنید.

تصویر(11)

سرچ کنسول معمولاً مشکلات مرتبط با معیار INP را در بخشی تحت عنوان “Why URLs aren’t considered good” نمایش می‌دهد. با کلیک روی گزینه INP issue می‌توانید صفحاتی را که عملکرد مناسبی ندارند شناسایی کرده و برای بهینه‌سازی آنها اقدام کنید.

تصویر(12)

۵. ابزار Screaming Frog

نرم‌افزار Screaming Frog یکی از شناخته‌شده‌ترین ابزارهای تحلیل فنی سایت در حوزه سئو است که امکان بررسی دقیق معیارهایی مانند شاخص INP را نیز فراهم می‌کند.

برای استفاده از این قابلیت ابتدا باید نرم‌افزار را به Google PageSpeed Insights متصل کنید. این اتصال از طریق API انجام می‌شود؛ لذا لازم است یک کلید API از سرویس PageSpeed دریافت کنید. پس از دریافت کلید API، در نرم‌افزار Screaming Frog به مسیر زیر بروید:

Configuration → API Access → PageSpeed Insights

در این قسمت کلید API را در بخش Secret Key وارد کرده و گزینه Connect را انتخاب کنید.

تصویر(13)

پس از برقراری اتصال، می‌توانید در تب Metrics نوع داده‌هایی که می‌خواهید بررسی شوند را مشخص نمایید. در این قسمت امکان انتخاب اطلاعات مربوط به معیار INP برای نسخه موبایل یا دسکتاپ سایت نیز وجود دارد.

اگر با تنظیمات این بخش آشنایی ندارید، بهتر است از تنظیمات پیش‌فرض استفاده کنید. این تنظیمات معمولاً داده‌های CrUX و همچنین اطلاعات Google Lighthouse را در گزارش نهایی پوشش می‌دهند.

در پایان فرآیند تحلیل، Screaming Frog گزارشی کامل ارائه می‌دهد که شامل پیشنهاداتی برای بهبود عملکرد صفحات و کاهش مقدار شاخص INP است. این پیشنهادها می‌توانند به شما کمک کنند تا تجربه کاربری سایت خود را به شکل قابل توجهی بهبود دهید.

نکته مهم این است که برخی از معیارها مانند Core Web Vitals Assessment تنها برای نسخه ۱۴.۲ نرم‌افزار Screaming Frog و نسخه‌های جدیدتر در دسترس هستند. بنابراین اگر قصد بررسی دقیق شاخص INP را دارید، بهتر است از نسخه‌های بروز این ابزار استفاده کنید.

تصویر(14)

برای شروع تحلیل، کافی است آدرس کامل سایت خود را در بخش “Enter URL to spider” وارد کرده و گزینه Start را انتخاب کنید تا فرآیند بررسی آغاز شود.

اگر قصد دارید چند سایت مختلف را به‌طور همزمان تحلیل کنید، می‌توانید از مسیر Mode → List استفاده نمایید و آدرس صفحات موردنظر را به‌صورت لیست وارد کنید.

تصویر(15)

پس از پایان اسکن، به تب PageSpeed در سمت راست نرم‌افزار بروید. در این بخش اطلاعاتی درباره سرعت بارگذاری صفحات و معیارهای عملکردی از جمله معیار INP نمایش داده می‌شود.

تصویر(16)

در ستون Core Web Vitals Assessment می‌توانید وضعیت هر صفحه را مشاهده کنید. اگر عملکرد صفحه مناسب باشد، برچسب Pass و در غیر این صورت برچسب Fail نشان داده می شود.

تصویر(17)

نکته مهم دیگر این است که اگر در ستون ذکر شده داده‌ای مشاهده نکردید، معمولاً به این دلیل است که صفحه موردنظر بازدید کافی ندارد. ابزار Screaming Frog تنها صفحاتی را نمایش می‌دهد که داده‌های واقعی و کافی از گزارش Chrome UX برای آنها وجود داشته باشد.

آموزش کامل بهبود شاخص INP

برای بسیاری افراد این سوال مطرح است که عدد مناسب INP چقدر است؟ قبل از اینکه به این پرسش پاسخ داده شود باید بیان نمود، برای بهینه‌سازی شاخص INP لازم نیست همیشه تغییرات پیچیده‌ای در سایت ایجاد کنید. با انجام چند اقدام ساده اما مؤثر می‌توان سرعت پاسخ‌دهی صفحات را به شکل قابل توجهی افزایش داد. در ادامه مهم‌ترین روش‌های بهبود شاخص INP بررسی شده است.

۱. کاهش حجم صفحات سایت

یکی از ساده‌ترین روش‌ها برای بهبود معیار INP کاهش حجم کلی صفحات است. هرچه حجم صفحه کمتر باشد، مرورگر سریع‌تر آن را بارگذاری می‌کند و تعامل کاربران نیز سریع‌تر پردازش می‌شود. گوگل پیشنهاد می‌کند حجم هر صفحه وب تا حد امکان کمتر از ۵۰۰ کیلوبایت باشد.

برای بررسی حجم صفحات می‌توانید مراحل زیر را انجام دهید:

1. صفحه موردنظر را در مرورگری مانند Chrome یا Firefox باز کنید.
2. روی صفحه راست‌کلیک کرده و گزینه Inspect را انتخاب نمایید.

تصویر(18)

3. به تب Network بروید و صفحه را مجدداً Refresh کنید.

تصویر(19)

در این قسمت حجم هر فایل بارگذاری‌شده زیر ستون Size قابل مشاهده است. همچنین حجم کلی صفحه در پایین صفحه با برچسب‌هایی مانند MB transferred یا KB transferred نمایش داده می‌شود.

تصویر(20)

یکی از ساده‌ترین روش‌ها برای کاهش حجم صفحه، فشرده‌سازی تصاویر است. ابزارهایی مانند TinyPNG یا Compressor.io می‌توانند حجم تصاویر را بدون کاهش محسوس کیفیت، کم کنند.

روش مؤثر دیگر، استفاده از یک فونت واحد در کل سایت است. زمانی که از چندین فونت مختلف استفاده شود، مرورگر مجبور است فایل‌های بیشتری دانلود کند و همین موضوع می‌تواند سرعت صفحه و در نتیجه شاخص INP را تحت تأثیر قرار دهد.

۲. کاهش اندازه DOM

DOM ساختاری درختی است که تمام عناصر صفحه مانند متن‌ها، تصاویر و دکمه‌ها را سازماندهی می‌کند. هرچه تعداد عناصر DOM بیشتر باشد، پردازش صفحه برای مرورگر دشوارتر می‌شود. کوچک‌تر کردن ساختار DOM می‌تواند به بهبود سرعت پردازش صفحه و در نتیجه کاهش مقدار معیار INP کمک کند.

برای این کار بهتر است:

• عناصر غیرضروری HTML را حذف کنید.

• از ساختارهای ساده‌تر در طراحی صفحات استفاده نمایید.

• استایل‌های پیچیده را تا حد امکان کاهش دهید.

برای شناسایی صفحاتی که دارای DOM بزرگ هستند می‌توانید از ابزار Site Audit در Semrush استفاده کنید. در گزارش Core Web Vitals این ابزار، روی معیار Total Blocking Time (TBT) تمرکز کنید و سپس بخش Avoid an Excessive DOM Size را بررسی نمایید.

۳. کاهش زمان اجرای جاوا اسکریپت

زبان JavaScript مسئول ایجاد بسیاری از عناصر تعاملی در صفحات وب مانند منوها، فرم‌ها و انیمیشن‌ها است. با این حال اگر اجرای کدهای جاوا اسکریپت زمان زیادی ببرد، سرعت پاسخ‌دهی صفحه کاهش خواهد یافت.

کاهش زمان اجرای این کدها یکی از مهم‌ترین راه‌ها برای بهبود شاخص INP است زیرا هرچه پردازش جاوا اسکریپت سریع‌تر انجام شود، مرورگر نیز سریع‌تر می‌تواند به تعامل کاربران پاسخ دهد. برای شناسایی صفحاتی که به دلیل اجرای سنگین جاوا اسکریپت کند هستند، می‌توانید دوباره از گزارش Site Audit در Semrush استفاده کنید و بخش Core Web Vitals را بررسی نمایید.

۴. بهینه‌سازی فایل‌های جاوا اسکریپت

حجم زیاد فایل‌های جاوا اسکریپت یکی از عوامل مهم در افزایش زمان شاخص INP است. با بهینه‌سازی این فایل‌ها می‌توان عملکرد صفحات را به شکل محسوسی بهبود داد.

برای کاهش حجم و بهینه‌سازی این فایل‌ها می‌توانید از روش‌های زیر استفاده کنید:

• کاهش حجم کدهای جاوا اسکریپت بمنظور بارگذاری سریع‌تر.

• استفاده از فشرده‌سازی GZip برای کوچک‌تر کردن فایل‌ها.

• بهره‌گیری از فریم‌ورک‌های شناخته‌شده مانند AngularJS یا jQuery برای مدیریت بهتر کدها.

• استفاده از CDN برای توزیع فایل‌های جاوا اسکریپت از نزدیک‌ترین سرور به کاربران.

استفاده از CDN یکی از توصیه‌های رایج متخصصان سئو است؛ زیرا این شبکه‌ها فایل‌های استاتیک سایت را از سرورهای نزدیک به کاربران ارسال نموده و در نتیجه فشار روی سرور اصلی کاهش پیدا کرده و سرعت بارگذاری صفحات افزایش می‌یابد که در نهایت به بهبود شاخص INP کمک می‌کند.

۵. محدود کردن اسکریپت‌های شخص ثالث

اسکریپت‌های شخص ثالث به کدهایی گفته می‌شود که توسط منابعی خارج از وب‌سایت شما بارگذاری می‌گردند. ابزارهای تحلیل آمار، دکمه‌های اشتراک‌گذاری شبکه‌های اجتماعی، تبلیغات، پلیرهای ویدیو و صدا و برخی سرویس‌های خارجی از جمله این اسکریپت‌ها هستند.

هرچند این ابزارها امکانات بیشتری به سایت اضافه می‌کنند اما استفاده بیش از حد آنها می‌تواند روی معیار INP تأثیر منفی بگذارد. دلیل این موضوع مصرف زیاد پهنای باند و منابع پردازشی سرور است که سبب کند شدن بارگذاری صفحات می‌شود. بنابراین برای بهبود معیار INP بهتر است تنها از اسکریپت‌های ضروری استفاده کرده و ابزارهای غیرضروری را حذف یا جایگزین نمایید.

۶. استفاده از Web Workers برای پردازش‌های سنگین

Web Worker ها قابلیتی در جاوا اسکریپت هستند که اجازه می‌دهند برخی پردازش‌ها خارج از رشته اصلی مرورگر اجرا شوند. این ویژگی کمک می‌کند عملیات سنگین در پس‌زمینه انجام گردیده و عملکرد صفحه اصلی دچار اختلال نشود.

فرض کنید پس از راه‌اندازی یک سایت وردپرسی، صفحات آن شامل تصاویر، ویدیوها و محتوای متعددی هستند. در چنین شرایطی Web Workers می‌توانند محاسبات سنگین جاوا اسکریپت را در یک رشته جداگانه اجرا کنند تا عناصر صفحه سریع‌تر نمایش داده شوند و انیمیشن‌ها نیز بدون توقف اجرا گردند. این موضوع می‌تواند در بهبود شاخص INP نقش مهمی داشته باشد.

برای استفاده از این قابلیت معمولاً دو فایل جاوا اسکریپت ایجاد می‌شود:

• فایل main.js که اجرای Web Worker را آغاز می‌کند:

// main.js
if (window.Worker) {
// Create a new worker instance
const myWorker = new Worker('worker-script.js');
// Send a message to the worker
myWorker.postMessage('Hello Worker!');
// Listen for messages from the worker
myWorker.onmessage = function(e) {
console.log('Message received from worker', e.data);
};
} else {
console.log('Your browser does not support Web Workers.');
}

• فایل worker.js که وظایف پردازشی در آن تعریف می‌شود:

// worker.js
onmessage = function(e) {
console.log('Message received from main script', e.data);
// Perform heavy computation or data processing here
// Then send a message back to the main script
postMessage('Hello Main Script!');
}

در سایت‌های وردپرسی می‌توان این فایل‌ها را از طریق فایل functions.php قالب فراخوانی کرد و با استفاده از تابع wp_enqueue_script آنها را در سایت فعال نمود.

در پروژه‌های اختصاصی نیز لازم است توسعه‌دهنده سایت این ساختار را در کدهای پروژه پیاده‌سازی کند تا عملکرد بهتر و معیار INP پایین‌تری حاصل شود.

۷. شکستن وظایف طولانی جاوا اسکریپت

یکی از روش‌های مهم برای بهبود معیار INP تقسیم وظایف طولانی جاوا اسکریپت به بخش‌های کوچک‌تر است. در اصطلاح فنی به این کار Breaking up Long JavaScript Tasks گفته می‌شود.

وقتی یک وظیفه جاوا اسکریپت بسیار طولانی باشد، رشته اصلی مرورگر برای مدت زیادی درگیر آن می‌شود و نمی‌تواند به تعاملات کاربر پاسخ دهد. با تقسیم این وظایف به بخش‌های کوچک‌تر، مرورگر می‌تواند پردازش‌ها را بهتر مدیریت کند و به درخواست کاربران واکنش سریع‌تری نشان دهد.

برای این کار معمولاً از دو روش استفاده می‌شود:

۱. تابع setTimeout

این تابع داخلی جاوا اسکریپت امکان زمان‌بندی اجرای یک کد را پس از یک تأخیر مشخص فراهم می‌کند. با استفاده از این روش می‌توان اجرای برخی وظایف را به زمان دیگری منتقل کرد و از مسدود شدن رشته اصلی جلوگیری نمود.

۲. تابع requestIdleCallback

این API روش پیشرفته‌تری نسبت به setTimeout محسوب می‌شود. این تابع وظایف را در زمان‌هایی اجرا می‌کند که مرورگر در حالت بیکار قرار دارد. به همین دلیل تأثیر کمتری روی عملکرد اصلی صفحه گذاشته و می‌تواند در بهبود معیار INP بسیار مؤثر باشد.

۸. اولویت دادن به Input Readiness

Input Readiness به زمانی اشاره دارد که صفحه وب آماده پاسخ‌گویی به تعاملات کاربر باشد. اگر صفحه درگیر پردازش‌های سنگین باشد، این آمادگی کاهش پیدا می‌کند و در نتیجه شاخص INP افزایش می‌یابد.

برای افزایش Input Readiness و بهبود معیار INP می‌توان از روش‌های زیر استفاده کرد:

• به تعویق انداختن اجرای فایل‌های غیرضروری جاوا اسکریپت

• استفاده از تکنیک Throttling برای کنترل تعداد اجرای یک تابع در زمان‌های کوتاه

• استفاده از Debouncing برای جلوگیری از اجرای مکرر یک تابع در فاصله زمانی کوتاه

• بهره‌گیری از Passive Event Listeners برای مدیریت بهتر رویدادهایی مانند اسکرول یا لمس صفحه

این تکنیک‌ها باعث می‌شوند پردازش‌های مرورگر به شکل بهینه‌تری انجام گیرد و تعامل کاربران سریع‌تر پاسخ داده شود.

۹. ارائه بازخورد فوری به کاربر

در برخی مواقع تعامل کاربر با سایت ممکن است به پردازش‌های زمان‌بر منجر شود. برای مثال ارسال فرم‌هایی که شامل اطلاعات زیادی هستند می‌تواند چند ثانیه زمان ببرد. در چنین شرایطی استفاده از تکنیک Immediate Feedback یا بازخورد فوری بسیار مهم است. این روش با نمایش نشانه‌های بصری مانند انیمیشن لودینگ یا پیام در حال پردازش، به کاربر اطلاع می‌دهد که درخواست او دریافت شده و در حال انجام است.

اگرچه این تکنیک ممکن است زمان پردازش واقعی را کاهش ندهد اما باعث می‌شود کاربر احساس کند سایت سریع‌تر پاسخ می‌دهد و همین موضوع می‌تواند تجربه کاربری را بهبود داده و در نهایت باعث کاهش مقدار شاخص INP شود.

جمع بندی

شاخص INP یکی از معیارهای مهم در ارزیابی کیفیت فنی وب‌سایت‌ها است که در مجموعه Core Web Vitals گوگل قرار دارد و موجب افزایش سرعت پاسخگویی سایت می شود. این شاخص مدت زمانی را اندازه‌گیری می‌کند که طول می‌کشد تا یک صفحه وب به تعامل کاربر واکنش نشان دهد. به بیان ساده‌تر، شاخص INP مشخص می‌کند که وقتی کاربر روی دکمه‌ای کلیک کرده، صفحه را لمس می‌نماید یا اقدامی انجام می‌دهد، سایت با چه سرعتی نتیجه آن را روی صفحه نمایش خواهد داد.

برای بهبود شاخص INP معمولاً نیازی به تغییرات پیچیده نیست و با چند اقدام ساده می‌توان عملکرد سایت را بهینه نمود. کاهش حجم صفحات، محدود کردن اسکریپت‌های شخص ثالث، استفاده از Web Worker برای پردازش‌های سنگین و بهینه‌سازی کدهای جاوا اسکریپت، روش‌هایی هستند که می‌توانند به کاهش مقدار معیار INP کمک کنند. اجرای این اقدامات نه‌تنها سرعت سایت را افزایش می‌دهد بلکه تجربه کاربری بهتر و در نهایت سئوی قوی‌تری برای وب‌سایت به همراه خواهد داشت.