مانیتورینگ فرانتاند با RUM و Synthetic Tests
این صفحه Playbook کامل فرانتاند است: از راهاندازی RUM برای React و Vue.js تا تنظیم Browser Synthetic Tests برای مانیتورینگ مداوم عملکرد و تجربه کاربری.
Real User Monitoring (RUM)
با راهاندازی RUM، Web Vitals، خطاهای JavaScript، عملکرد شبکه و رفتار کاربران واقعی را در داشبورد واچلاگ مشاهده کنید.
فریمورک / پلتفرم را انتخاب کنید:
راهاندازی RUM برای React
با استفاده از پکیج watchlog-react-rum، RUM را در اپلیکیشن React خود راهاندازی کنید و Web Vitals، خطاها و عملکرد را مانیتور کنید.
- 1
نصب پکیج: `npm install watchlog-react-rum`
- 2
برای Web Vitals (اختیاری): `npm install web-vitals`
- 3
استفاده از `createBrowserRouter` از `watchlog-react-rum/react-router-v6` برای route tracking دقیق
- 4
راهاندازی `useWatchlogRUM` با API Key و Endpoint واچلاگ
- 5
تنظیم `sampleRate`، `networkSampleRate` و `interactionSampleRate`
- 6
فعال کردن `enableWebVitals` برای دریافت LCP، INP، CLS و TTFB
- 7
بررسی دادهها در داشبورد RUM واچلاگ
راهاندازی RUM در React
Setup → ارسال اولین داده → خواندن داشبورد
نکات مهم
- هر قدم را به ترتیب انجام دهید
- بعد از هر قدم، داشبورد RUM را بررسی کنید
- در صورت مشکل، به مستندات مراجعه کنید
تیم ما آماده کمک است
تیم ما آماده است تا در راهاندازی و پیکربندی Watchlog برای فرانتاند شما کمک کند.