تغییرات اخیر

در اینجا اطلاعیه‌ها، نسخه‌ها و تغییرات جدید لیارا فهرست می‌شوند.

تأخیر در اولین تعامل (FID) چیست، شناخت کامل آن


۲۹ فروردین ۱۴۰۴

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

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

همین الان، بدون کمترین پیچیدگی، سرور مجازی خودتون رو در کمتر از ۳۰ ثانیه، راه‌اندازی کنید.
✅ عملکرد پایدار ✅ ترافیک نامحدود ✅ هزینه به‌صرفه
خرید سرور مجازی ابری

تأخیر در اولین تعامل (FID)

آنچه در ادامه خواهید خواند:

  • تاخیر در اولین تعامل یا FID چیست؟
  • FID زمان را چگونه اندازه گیری می‌کند؟
  • نکات مهم در اندازه گیری FID یا تاخیر اولین تعامل
  • علت تاخیر اولین ورودی First Input Delay
  • FID مناسب و اصولی
  • چگونه FID یا تاخیر اولین ورودی را اندازه گیری کنیم؟
  • گزارش تجربه کاربران کروم CrUX
  • استفاده از ابزار PageSpeed Insights

تاخیر در اولین تعامل یا FID چیست؟

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

FID زمان را چگونه اندازه گیری می‌کند؟

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

مهم‌ترین نکته‌ای که باید درباره‌ی FID بدانید این است که گوگل از آن به‌عنوان یکی از عوامل رتبه‌بندی استفاده می‌کند. FID یکی از Core Web Vitals یا شاخص‌های حیاتی وب است، مجموعه‌ای از معیارهایی که گوگل برای تعیین کیفیت تجربه‌ی کاربری سایت و در نتیجه، رتبه‌بندی صفحات استفاده می‌کند. علاوه بر این، بهبود عملکرد سایت و تجربه‌ی کاربری معمولاً منجر به افزایش نرخ تبدیل، فروش و درآمد تبلیغاتی می‌شود.

این دقیقاً همان دلیلی است که First Input Delay را به یکی از بهترین معیارهای عملکرد وب تبدیل می‌کند؛ چرا که این معیار، تجربه‌ی واقعی کاربران را اندازه‌گیری می‌کند و نمی‌توان آن را در محیط آزمایشگاهی شبیه‌سازی کرد. برای اندازه‌گیری FID به تعامل واقعی کاربران نیاز است، چرا که این شاخص عملکرد واقعی کاربران هنگام ورود به صفحه را نشان می‌دهد.

نکات مهم در اندازه گیری FID یا تاخیر اولین تعامل

نکاتی وجود دارد که هنگام اندازه‌گیری تاخیر در اولین تعامل (FID) باید به آن‌ها توجه کرد. در ادامه این نکات را شرح داده‌ایم.

FID تنها تعاملات محدود را اندازه‌ گیری می‌کند

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

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

FID تنها اولین تعامل کاربر را اندازه‌ گیری می‌ کند

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

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

FID با Time to Interactive (TTI) متفاوت است

یکی از معیارهای مفید وب است که ممکن است با First Input Delay (FID) اشتباه گرفته شود. TTI یا زمان تعاملی شدن، مدت‌زمانی را اندازه‌گیری می‌کند که طول می‌کشد تا یک صفحه‌ی وب به مرحله‌ای برسد که کاربر بتواند بدون مشکل با آن تعامل داشته باشد. این یعنی تمام محتوای ضروری بارگذاری شده، واکنش‌ها سریع هستند (کمتر از ۵۰ میلی‌ثانیه) و از همه مهم‌تر، همه‌ی عناصر صفحه آماده‌ی پاسخ‌گویی به کلیک هستند.

اما FID تفاوت‌های قابل‌توجهی با این معیار دارد. FID بر اولین تعامل کاربر با صفحه تمرکز دارد. یعنی همان لحظه‌ای که کاربر، پیش از کامل شدن بارگذاری صفحه، روی یک لینک کلیک می‌کند یا دکمه‌ای را فشار می‌دهد.

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

بیشتر بخوانید: آشنایی با CrUX و روش‌های دسترسی به گزارش‌های آن

علت تاخیر اولین ورودی First Input Delay

چندین عامل مختلف می‌تواند بر معیار تاخیر در اولین ورودی FID تاثر بگذارد که در ادامه آن را شرح داده‌ایم.

بارگذاری جاوا اسکریپت سنگین و تأثیر آن بر سرعت

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

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

تأخیر در اولین ورودی پس از بارگذاری جاوا اسکریپت‌ها

حتی پس از بارگذاری کامل فایل‌های جاوااسکریپت، ممکن است همچنان با تأخیر طولانی در اولین ورودی (FID) مواجه شوید. احتمالاً این سؤال برای شما پیش می‌آید که دلیل این اتفاق چیست. دلیل آن این است که فعالیت‌های سنگین جاوااسکریپت بر روی نخ اصلی (Main Thread) اجرا می‌شود. این به آن معناست که وقتی مرورگر مشغول اجرای یک وظیفه‌ی سنگین است، ورودی‌های کاربر مسدود می‌مانند و تا زمانی‌که آن وظیفه به پایان نرسد، هیچ ورودی جدیدی پردازش نخواهد شد. این مشکل معمولاً به‌دلیل استفاده از کدهای بهینه‌نشده به‌وجود می‌آید.

سرعت و قدرت پردازش دستگاه کاربر

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

FID مناسب و اصولی

FID به میلی‌ثانیه اندازه‌گیری می‌شود، بنابراین هرچه این زمان کمتر باشد، برای شما بهتر است.

معیار های FID در PageSpeed Insights

  • FID کمتر از 100 میلی‌‌ثانیه، مناسب است.
  • FID بین 100 تا 300 میلی‌ثانیه نیاز به بهبود دارد.
  • FID بالای 300 میلی‌ ثانیه، ضعیف است.

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

چگونه FID یا تاخیر اولین ورودی را اندازه گیری کنیم؟

برای اینکه بتوانید تاخیر اولین ورودی در سایت را اندازه‌گیری کنید، از ابزارهای زیر استفاده کنید.

  • گزارش تجربه کاربران کروم (CrUX)
  • ابزار PageSpeed Insights
  • گزارش Core Web Vitals در سرچ کنسول

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

گزارش تجربه کاربران کروم CrUX

اگر با ابزارهای فنی و محیط‌های برنامه‌نویسی آشنایی داشته باشید، می‌توانید از گزارش‌های تجربه کاربران واقعی مرورگر کروم (Chrome User Experience Report) استفاده کنید. این گزارش داده‌های مربوط به عملکرد واقعی سایت را از دید کاربران نهایی جمع‌آوری کرده و در اختیار توسعه‌دهندگان قرار می‌دهد.

برای دسترسی به این داده‌ها دو روش وجود دارد که می‌توانید از آن استفاده کنید.

استفاده از BigQuery

این سرویس اطلاعات را به تفکیک دامنه Origin و در ابعاد مختلفی ارائه می‌دهد. برای استفاده از این قابلیت، به یک حساب کاربری گوگل و پروژه فعال در Google Cloud نیاز خواهید داشت.

استفاده از داشبورد CrUX در Data Studio

این روش یکی از ساده‌ترین راه‌ها برای کاربران است که می‌توانند از آن استفاده کنند. توسعه‌دهندگان می‌توانند با مراجعه به آدرس g.co/chromeuxdash، دامنه مورد نظر خود را وارد کرده و داشبورد مربوط به عملکرد سایت را دریافت کنند.

در این داشبورد، معیارهای Core Web Vitals از جمله FID به‌صورت ماهیانه نمایش داده می‌شود. این شاخص‌ها از مهم‌ترین معیارهای تجربه کاربری از نگاه گوگل هستند و بررسی منظم آن‌ها می‌تواند نقش مهمی در بهبود عملکرد سایت داشته باشد.

مطالعه بیشتر: LCP چیست و چه تأثیری بر Core Web Vitals دارد؟

استفاده از ابزار PageSpeed Insights

یکی از مناسب‌ترین ابزارها برای تست تاخیر اولین ورودی FID، ابزار PageSpeed Insights از گوگل است. این ابزار رایگان، عملکرد سایت شما را از جنبه‌های مختلف ارزیابی می‌کند و نتایج را با استفاده از معیارهای کلیدی، از جمله First Input Delay نمایش می‌دهد.

به خاطر داشته باشید که FID نیاز به یک ورودی واقعی از سمت کاربر دارد. اما به محض آنکه سایت شما تعامل کاربری داشته باشد، می‌توانید نتیجه آن را در PageSpeed Insights مشاهده کنید. گوگل این نمره را به‌عنوان داده‌های واقعی Field Data نشان می‌دهد، چرا که بر اساس تعاملات واقعی کاربران است.

برای استفاده از این ابزار، کافی است که آدرس سایت را وارد کرده و بر روی Analyze کلیک کنید. بعد از اینکه ابزار بررسی‌ها را انجام داد، باید به بخش Field Data بروید. این بخش نشان می‌دهد که کاربران واقعی چگونه سایت شما را دیده‌اند و می‌توانید First Input Delay (FID) را مشاهده کنید. سپس، به بخش Opportunities بروید تا پیشنهادهای بهینه‌سازی صفحه و بهبود نمرات خود را دریافت کنید.

استفاده از Core Web Vitals در Google Search Console

اگر علاقه مند هستید که از روش دیگری برای اندازه‌گیری FID استفاده کنید می‌توانید از گزارش Core Web Vitals در Google Search Console برای اندازه‌‌گیری FID استفاده کنید. برای این کار ابتدا باید وارد گوگل سرچ کنسول خود شوید و بعد از آن وارد منوی Experience، گزینه Core Web Vitals را انتخاب کنید. در این بخش، می‌توانید FID را برای کاربران موبایل و یا دسکتاپ را بررسی کنید. برای این کار تنها کافی است که از بین گزارش‌های Mobile و یا Desktop یکی را انتخاب کنید.

بهینه سازی FID

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

بهینه سازی و فشرده سازی کد های CSS و JavaScript

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

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

جلوگیری از اجرای طولانی کدهای جاوا اسکریپت

مشکل اصلی، وظایف طولانی جاوا اسکریپت است که می‌تواند نخ اصلی (main thread) را مسدود کرده و اجازه ندهد که ورودی‌های کاربران پردازش شوند. در نتیجه، این مسأله باعث کاهش واکنش‌پذیری سایت می‌شود.

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

کم کردن بار اضافی سایت با حذف کدهای غیر ضروری

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

برای ادامه مطالعه و یادگیری: Let’s Encrypt چیست؟ گواهی SSL رایگان برای امنیت وب‌سایت‌ها

نحوه تشخیص اولویت بندی اسکریپت ها

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

روش Idle Until Urgent

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

این استراتژی ترکیبی از دو رویکرد مهم ارزیابی کد است.

  • ارزیابی فوری (Eager evaluation): در این روش، تمام کدها به صورت همزمان اجرا می‌شوند و باعث می‌شود که صفحه مدت زیادی را تا بارگذاری کامل و تعامل کاربر کند شود.
  • ارزیابی تنبل‌وارانه (Lazy evaluation): کد تنها زمانی اجرا می‌شود که به آن‌ها نیاز باشد.

روش Web Workers

روش Web Workers این قابلیت را به شما می‌دهد تا بتوانید اسکریپت‌هایتان را در پس‌زمینه اجرا کنید بدون آنکه تاثیری بر نخ اصلی شما بگذارد. انتقال عملیات غیر UI به نخ پس‌زمینه یک روش مناسب برای توسعه‌دهندگان وب است تا بتوانند سایت را به بهترین شکل ممکن اجرا کنند.

سوالات متداول

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

FID چیست؟

FID مدت زمانی است که بین اولین تعامل کاربر با سایت (مانند کلیک یا لمس) و واکنش سایت به آن تعامل طول می‌کشد.

چرا FID اهمیت دارد؟

زیرا نشان می‌دهد سایت شما چقدر سریع به کاربر پاسخ می‌دهد. تأخیر زیاد در این بخش می‌تواند تجربه کاربری را ضعیف کند.

FID چقدر باید باشد؟

کمتر از ۱۰۰ میلی‌ثانیه. اگر بین ۱۰۰ تا ۳۰۰ میلی‌ثانیه باشد، نیاز به بهبود دارد. بالای ۳۰۰ میلی‌ثانیه ضعیف محسوب می‌شود.

چه عواملی باعث افزایش FID می‌شود؟

کدهای سنگین جاوااسکریپت، وظایف طولانی در نخ اصلی، و اسکریپت‌های اضافی یا غیرضروری.

از چه ابزاری برای اندازه‌ گیری FID استفاده کنیم؟

  • PageSpeed Insights
  • گزارش Core Web Vitals در Google Search Console
  • Chrome UX Report

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

اسکریپت‌ های تبلیغاتی و ابزار های جانبی چه تأثیری دارند؟

اگر به درستی مدیریت نشوند، می‌توانند سرعت سایت را کاهش دهند و FID را افزایش دهند.

چطور می‌ توان کد های جاوا اسکریپت را بهینه کرد؟

با فشرده‌سازی کدها، تقسیم وظایف سنگین، و استفاده از روش‌هایی مانندasync وdefer برای بارگذاری اسکریپت‌ها.

Web Worker چیست و چه نقشی دارد؟

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

جمع بندی

تأخیر در اولین ورودی (FID) یکی از شاخص‌های کلیدی در ارزیابی تجربه کاربری وب‌سایت است. هرچه زمان پاسخ‌ دهی سایت به تعاملات اولیه کاربر کمتر باشد، عملکرد سایت مطلوب‌ تر ارزیابی می‌شود. عواملی مانند کدهای سنگین جاوا اسکریپت و اسکریپت‌ های غیر ضروری می‌توانند موجب افزایش این تأخیر شوند. با بهینه‌ سازی کدها و استفاده از ابزارهای تحلیلی مانند PageSpeed Insights، می‌توان این شاخص را بهبود بخشید و تجربه کاربری را ارتقا داد.

مطالعه بیشتر: نگاهی عمیق به معماری Iptables و Netfilter

به اشتراک بگذارید