شروع کار با اندازه گیری web vitals

مقدمه

جمع آوری داده ها و اندازه گیری web vitals سایت اولین قدم در جهت بهبود آنها است. تجزیه و تحلیل جامع داده‌ها کمک می‌کند عملکرد سایت را در محیط‌های واقعی و آزمایشگاهی جمع آوری کرد.اندازه گیری web vitals ها به حداقل کدنویسی نیاز دارد و می‌تواند با استفاده از ابزارهای رایگان انجام شود.

اندازه گیری web vitals با استفاده از داده های RUM

داده های نظارت بر کاربر واقعی (RUM) که به عنوان داده های میدانی نیز شناخته می شود، عملکرد کاربران واقعی یک سایت را نشان می دهد. داده های RUM چیزی است که Google برای تعیین اینکه آیا یک سایت آستانه های توصیه شده Core Web Vitals را برآورده می کند یا خیر استفاده می کند.

شروع اندازه‌گیری

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

• PageSpeed Insights (PSI) :این ابزار گزارشی کلی بررسی صفحه طی 28 روز گذشته و پیشنهاداتی در مورد نحوه بهبود سرعت سایت ارائه می دهد. اگر به دنبال شروع اندازه گیری و بهبود وب سایت سایت خود هستید ، توصیه می کنیم از PSI برای بررسی سایت خود استفاده کنید.
• Search Console : این ابزار گسترده و قدرتمند گوگل داده های عملکردی سایت را به صورت صفحه ای گزارش می کند. این امر برای شناسایی صفحات خاصی که نیاز به بهبود دارند مناسب است. بر خلاف PageSpeed Insights ، گزارش کنسول جستجو شامل داده های قدیمی نیز هست. Search Console فقط برای سایتهایی که شما مالک آنها هستید و مالکیت آنها تأیید شده است قابل استفاده است.
• داشبورد CrUX یک داشبورد از پیش ساخته شده است که داده های CrUX را برای منابع مورد نظر شما نشان می دهد. این برنامهبر روی پلات فرم Data Studio ساخته شده است و مراحل راه اندازی آن حدود یک دقیقه به طول می انجامد. در مقایسه با PageSpeed Insights و Search Console ، گزارش داشبورد CrUX دارای امکانات بیشتری است . به عنوان مثال ، داده ها را می توان بر اساس دستگاه و نوع اتصال تجزیه کرد.

شایان ذکر است که اگرچه ابزارهای ذکر شده بالا برای “شروع” اندازه گیری Web Vitals مناسب هستند ، اما می توانند در زمینه های دیگر نیز مفید باشند. به طور خاص ، هر دوابزار CrUX و PSI به عنوان یک API در دسترس هستند و می توانند برای ایجاد گزارش های دیگر مورد استفاده قرار گیرند.

جمع آوری داده های RUM

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

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

کتابخانه جاوا اسکریپت web-vitals

اگر به ارائه دهنده تخصصی RUM دسترسی ندارید ، می‌توانید با استفاده از کتابخانه جاوا اسکریپت web-vitals ، داده های سایت خود را جمع آوری، تجزیه و تحلیل و گزارش کنید. این روش در ادامه با جزئیات بیشتری توضیح داده شده است.

اگر از برنامه نویسی برای اندازه گیری Web Vitals استفاده می کنید ، ساده ترین راه برای جمع آوری داده ها و اندازه گیری Web Vitals با استفاده از کتابخانه جاوا اسکریپت web-vitals است. web-vitals یک کتابخانه کوچک و مدولار (K 1KB) است که یک API مناسب برای جمع آوری و گزارش هریک از معیارهای اندازه گیری Web Vitals فراهم می کند.

برای اطلاعات بیشتر در مورد نحوه پیاده سازی Web-vitals می‌توانید از مستندات وب ویتال گوگل کروم استفاده کنید.

تجمیع داده‌ها بعد از اندازه گیری web vitals

ضروری است که داده های جمع آوری شده توسط web-vitals را گزارش دهید. اگر این داده‌ها اندازه گیری شود اما مجالی برای گزارش پیدا نشود ، داده‌های جمع آوری شده هیچ اهمیتی نخواند داشت. اسناد web-vitals شامل نمونه هایی است که نحوه ارسال داده ها را به ابزارهایی مانند Google Analytics یا Google Tag Manager نشان می دهد.

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

تفسیر اطلاعات

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

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

اندازه گیری web vitals با استفاده از داده‌های آزمایشگاهی

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

ملاحظات در اندازه گیری web vitals

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

• تغییر چیدمان تجمعی (CLS): تغییر چیدمان تجمعی اندازه گیری شده در محیط های آزمایشگاهی می تواند به طور مصنوعی کمتر از CLS مشاهده شده در داده های RUM باشد. CLS به “مجموع نمرات هر تغییر چیدمان غیر منتظره ای که در طول عمر صفحه رخ می دهد” گفته می‌شود. با این حال ، طول عمر یک صفحه بسته به نوع بارگیری توسط کاربر واقعی یا ابزار اندازه گیری مصنوعی ، معمولاً بسیار متفاوت است. بسیاری از ابزارهای آزمایشگاهی فقط صفحه را بارگذاری می کنند و با آن تعامل ندارند. در نتیجه ، آنها فقط تغییرات طرح بندی را که هنگام بارگذاری اولیه صفحه رخ می دهد ضبط می کنند. در مقابل ، CLS اندازه گیری شده توسط ابزارهای RUM تغییرات چیدمان غیر منتظره ای را که در طول عمر صفحه رخ می دهد ، ثبت می کند.
• اولین تأخیر ورودی (FID): اولین تأخیر ورودی را نمی توان در محیط های آزمایشگاهی اندازه گیری کرد زیرا به تعامل کاربر با صفحه نیاز دارد. در نتیجه ، Total Blocking Time (TBT) پروکسی آزمایشگاهی توصیه شده برای FID است. TBT “کل زمان بین اولین محتوای رنگ آمیزی و زمان تعاملی که طی آن صفحه از پاسخ به ورودی کاربر مسدود می شود” را اندازه گیری می کند. اگرچه FID و TBT متفاوت محاسبه می شوند ، اما هر دو بازتاب یک نخ اصلی مسدود شده در طول فرآیند بوت استرپ هستند. هنگامی که نخ اصلی مسدود می شود ، مرورگر در پاسخ به تعاملات کاربر تأخیر می کند. FID تاخیری را که در اولین باری که کاربر سعی می کند با یک صفحه تعامل کند ، اندازه گیری می کند.

ابزارها

از این ابزارها می توان برای جمع آوری اندازه گیری Web Vitals به صورت آزمایشگاهی استفاده کرد:

• Web Vitals Chrome Extension:این افزونه کروم (LCP ، FID و CLS) را برای یک صفحه معین اندازه گیری و گزارش می کند. این ابزار به منظور ایجاد بازخورد عملکرد در زمان واقعی در هنگام ایجاد تغییرات در برنامه ، در نظر گرفته شده است.
• Lighthouse گزارش هایی در مورد LCP ، CLS و TBT و همچنین راه حل هایی برای بهبود آنها ارائه می‌کند
• WebPageTest :شامل معیارهای Web Vitals به عنوان بخشی از گزارش های استاندارد خود است. WebPageTest برای جمع آوری اطلاعات Web Vitals تحت شرایط خاص( دستگاه و شبکه) مفید است.