Real User Monitoring (RUM) is one of the key concepts of Application Performance Monitoring, and it is also the best practice in SRE. RUM will get all the key metrics of the Web Application and Mobile Application. It ensures the health, performance and accessibility of the application for the real users (not bots) who are working on the application across the world.
Difference Between RUM and Synthetic Monitoring
Real User Monitoring (RUM) captures actual user experiences on your application, while Synthetic Monitoring simulates scripted interactions in controlled environments. RUM gives you field truth; Synthetic provides proactive, predictable testing. The best practice is to use both together for complete visibility.
Prerequisites for Datadog RUM Setup
- Datadog Account and RUM Application Creation: You should have a Datadog Account with proper privilege access in the Datadog environment.
- Use Supported Browsers & Frameworks: Make sure that you can access your frontend application in top rated broswsers like Google Chrome, Microsoft Edge, Mozilla Firefox and Safari.
- Required Permissions and API Settings: Make sure that your application permits RUM JS code to capture your frontend application metrics and send data to Data Dog UI
How to Set Up Datadog RUM Using Manual JavaScript Code
Before proceeding with RUM JavaScript code manual injection, please complete above mentioned Prerequsites steps that will ensure smooth implementation. After that, please proceed on below steps accordingly.
- Creating a RUM Application in Datadog
- Adding RUM Script to HTML / Web Application
- Verifying RUM Data in Datadog Dashboard
Creating a RUM Application in Datadog
Log in to your Datadog environment and navigate the path: Navigation Menu -> Digital Experience -> Manage Applications -> Click on New Application once you come to this path. Providethe Application name and choose the type of Application, e.g., JS, Android, iOS. If you want a clear picture of the steps, refer snapshots given below.
Adding RUM Script to HTML / Web Application
Once you have created your Application in Datadog it will move to the page: Finishing Setup your Application. Select Manual Instrumentation (Adding RUM JS manually to application code), followed by selecting the type CDN Async or CDNsync. The best recommendation is CDNsync.
Please provide all the necessary details, like Environment, Service Name, Session Sample Rate, and Session Replay Sample Rate, according to your requirement. If you want a clear picture of the steps, refer snapshots given below.
Once you provided all the details and have the RUM JS code, please copy the code and save it in a notepad or a doc file. In the top-left corner, you’ll see the message “Waiting for data.” This means the RUM JavaScript code has not been injected into the HTML webpage or your application, or you have not yet included it.
Paste the copied RUM JS code into your Webpages of the application and generate some traffic from various devices and locations. Please refer sanpshots given below.
Inject the RUM JS code into your webpages of the application, as shown below
After the injection is successfully completed, generate some traffic to the webpage. This will ensure that data is collected and displayed in the Datadog UI console. Once it captures traffic, you can see the user sessions in Datadog UI as shown below.
You can review all the data captured by the RUM JavaScript code from your application. This includes insights such as Session Explorer, Session Count, Error Tracking, and user events like clicks and load actions that occurred during a specific user session, as illustrated below.
You can also find the Browser, Location Type of Device, which are really helpful to you to troubleshoot.
KPI's That Datadog RUM can Captures
- Slowest Resources
- Core Web Vitals like LCP, FCP
- Debug Frontend Errors
- XHR
Datadog RUM Dashboard
Once Datadog RUM starts collecting data in your Datadog environment, the default RUM dashboard will be enabled. This dashboard provides all the key performance indicators and is extremely useful for troubleshooting. As shown below.
