You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/apm/real-user-monitoring/browser-traces.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,7 +6,7 @@ sidebar_label: RUM Browser Traces
6
6
7
7
To collect browser RUM traces, create a [trace query](/docs/apm/traces/view-and-investigate-traces) that specifies traces starting with the value you gave to `<name_of_your_web_service>` as a root service name. You can also include the following filters as an operation name:
8
8
*`documentLoad` as an operation name to find traces that correspond to page loads.
9
-
*`Click on *` as an operation name to detect click actions (previously used to infer XHR activity, which is currently unsupported).
9
+
*`Click on *` as an operation name to detect click actions that most likely resulted in XHR calls.
10
10
*`Navigation: *` as an operation name to detect single-page app navigation changes.
11
11
12
12
Click on any of the load spans, such as `documentLoad`, `documentFetch`, or `resourceFetch` (for `documentLoad`), to open a right-side panel with detailed span metadata, including timing events.
To utilize navigation/route changes and errors collection, you must use RUM script version 4 or higher (`https://rum.sumologic.com/sumologic-rum-v4.js`). XHR metrics are currently unsupported. For automatic updates, use the script `https://rum.sumologic.com/sumologic-rum.js`. You can find more details about versioning control [later in this document](#step-2-add-rum-script-to-your-page-header).
44
+
To utilize XHR and navigation/route changes, and errors collection, you must use RUM script version 4 or higher (`https://rum.sumologic.com/sumologic-rum-v4.js`). Make sure you're using the correct version in your pages. For automatic updates, use the script `https://rum.sumologic.com/sumologic-rum.js`. You can find more details about versioning control [later in this document](#step-2-add-rum-script-to-your-page-header).
46
45
47
46
For full end-to-end visibility, we recommended supplementing your RUM browser auto-instrumentation with the appropriate [back-end tracing instrumentation](/docs/apm/traces/get-started-transaction-tracing).
Copy file name to clipboardExpand all lines: docs/apm/real-user-monitoring/dashboards.md
+6-4Lines changed: 6 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -43,7 +43,7 @@ Once the RUM app has been installed, use the Real User Monitoring view to gain v
43
43
***deployment.environment**. corresponds to your development environment. To enable this, add the `deployment.environment` tag and desired value (like `us-west-1`, `prod`, `dev`) to your [RUM script](/docs/apm/real-user-monitoring/configure-data-collection/#step-2-add-rum-script-to-your-page-header). Supports up to 10 **deployment.environment** values.
44
44
***Action Type**: can be one of:
45
45
***document loads**. Representing loading of actual documents and their resources into the browser
46
-
***XHR actions**. Previously used to represent AJAX-style interactions (XHR metrics are currently unsupported), or
46
+
***XHR actions**. Representing any interaction with a page like click or submit that executes AJAX requests in the background to communicate with the backend, or
47
47
***route changes**. Single-page-app specific way to navigate to a new page/view without having to load a new document.
48
48
***Action Name**. Automatically generated from URLs. No configuration is required. The specifics of it will depend on action type. Action names can contain asterisks (`*`) to replace automatically-detected dynamic parts of the URL. If you have action names that overlap, the action name with an asterisk contains data for page loads NOT contained in more specific action names. For example, `http://www.site.com/path/page.htm` does not contain actions from `http://www.site.com/path/*`.
49
49
@@ -58,7 +58,7 @@ The **RUM Overview** dashboards (**Application**, **Service**, **Service with En
58
58
59
59
Use these dashboards to:
60
60
* Analyze load and paint timings for page document loads by application, service, or action.
61
-
* View information about core web vitals and log errors (XHR processing metrics are currently unsupported).
61
+
* View information about [core web vitals, XHR processing times/errors, and log errors](/docs/apm/real-user-monitoring/metrics/#xhr-monitoring-metrics).
62
62
* Understand what top browsers, operating systems, and geolocations are active with your website.
63
63
64
64
You can select the timing metric type in the **statistic** dropdown on the dashboard header. This will change the browser time metrics types on charts.
@@ -78,7 +78,7 @@ The **RUM - TopN - Application** and **RUM - TopN - Application Service** dashbo
78
78
Use these dashboards to:
79
79
* Find out top N browsers, operating systems, and geolocations by load or requests.
80
80
* Understand the slowest and fastest browsers from a rendering perspective or geographical locations from a network perspective.
81
-
* Understand log errors your users are experiencing (XHR metrics are currently unsupported).
81
+
* Understand [XHR and log errors](/docs/apm/real-user-monitoring/metrics/#xhr-monitoring-metrics) your users are experiencing.
82
82
* Find out which browsers and operating systems are in use by your users and where are they are geographically located.
83
83
84
84
You can select the timing metric type in the **statistic** dropdown on the dashboard header. This will change the browser time metrics types on charts. You can also define the top N number for all charts.
@@ -91,7 +91,7 @@ The **RUM Performance Analytics** dashboards for **Application**, **Service**, a
91
91
92
92
Use these dashboards to:
93
93
* Filter data for specific combinations of browser, operating system, and/or geolocation.
94
-
* Understand load and timing metrics for the selected user cohort (XHR metrics are currently unsupported).
94
+
* Understand [XHR, load, timing metrics](/docs/apm/real-user-monitoring/metrics/#xhr-monitoring-metrics) for the selected user cohort.
95
95
* Compare your selected timings against data for a different time period by selecting the appropriate option in the compare_with dropdown.
96
96
97
97
You can click on any data point on the charts to open a details panel and view the **Infrastructure** tab to drill-down to traces representing user transactions from the selected time point. For cross-dimensional metrics, only the average statistic type is available.
@@ -132,6 +132,8 @@ In addition to that, we also aggregate that information in form of log-query bas
132
132
133
133
<img src={useBaseUrl('img/rum/logerrors2.png')} alt="Real User Monitoring log errors per second graphic" />
134
134
135
+
<img src={useBaseUrl('img/rum/logerrors-xhr.png')} alt="Real User Monitoring log errors XHR per second graphic" />
136
+
135
137
<img src={useBaseUrl('img/rum/logerrors-by-browser.png')} alt="Real User Monitoring log errors by browser, operating system, and geolocations graphic" />
136
138
137
139
Logs collection is enabled by default. You can disable by setting `collectErrors=false` in your RUM script options.
Copy file name to clipboardExpand all lines: docs/apm/real-user-monitoring/index.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -21,7 +21,7 @@ The [Sumo Logic OpenTelemetry auto-instrumentation for JavaScript](https://githu
21
21
22
22
This data is gathered directly from your end-user devices and displayed as individual spans representing user-initiated actions (like clicks or document loads) at the beginning of each trace, reflecting its request journey from the client throughout the whole application and back. This includes any unhandled errors, exceptions, and console errors generated by the browser.
23
23
24
-
All data collected is compatible with OpenTelemetry and doesn't use proprietary vendor code. Real user monitoring supports document load actions and route changes for single-page app navigation. XHR communication is currently not supported due to a known issue. The full list of functionalities and configuration is available in the [Sumo Logic OpenTelemetry auto-instrumentation for JavaScript](https://github.com/SumoLogic/sumologic-opentelemetry-js) README file.
24
+
All data collected is compatible with OpenTelemetry and doesn't use proprietary vendor code. Real user monitoring supports document load actions as well as XHR communication and route changes for single-page app navigation. The full list of functionalities and configuration is available in the [Sumo Logic OpenTelemetry auto-instrumentation for JavaScript](https://github.com/SumoLogic/sumologic-opentelemetry-js) README file.
Copy file name to clipboardExpand all lines: docs/apm/real-user-monitoring/metrics.md
+46-1Lines changed: 46 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,7 +8,7 @@ import useBaseUrl from '@docusaurus/useBaseUrl';
8
8
9
9
RUM metrics are automatically generated for you from browser traces. They provide insight into your website's overall user experience as well as front-end services, operating systems, geographical locations, and top-loaded page groups and user cohorts categorized by their browsers.
10
10
11
-
Metrics are collected for user actions representing document loads and route changes, which means actual retrieval and execution of web documents in the browser or navigation within single-page apps. While XHR calls may still occur, XHR-specific metrics are currently unsupported. Measurements include W3C navigation timings, Core Web Vitals KPIs, and longtask events.
11
+
Metrics are collected for user actions representing document loads, which means actual retrieval and execution of web documents in the browser as well as XHR calls and route changes. Measurements include W3C navigation timings, XHR delays, Core Web Vitals KPIs, longtask events (delays) and others.
12
12
13
13
For ad hoc queries, you can find these metrics in [Metrics Explorer](/docs/metrics/metrics-queries/metrics-explorer.md) by querying for:
14
14
```sql
@@ -121,6 +121,51 @@ These CWV KPIs are captured and displayed on Overview dashboards for Document Lo
121
121
122
122
[Cumulative Layout Shift (CLS)](https://web.dev/cls/) measures visual stability. To provide a good user experience, pages should maintain a CLS of **0.1** or less.
123
123
124
+
## XHR monitoring metrics
125
+
126
+
:::note
127
+
Currently, XHR metrics extraction in RUM is only supported for applications that use the `fetch` API to perform XHR calls. If your application uses `XMLHttpRequest`, metrics may not be collected at this time. A fix to support `XMLHttpRequest`-based calls is in progress and expected to roll out in mid 2025. We will update this page when that support becomes available.
128
+
:::
129
+
130
+
An **XMLHttpRequest (XHR)** is a way for browsers to communicate with a backend server without reloading the page. For example, a page may use XHR to update a price ticker automatically or after clicking an “Update Price” button.
131
+
132
+
XHR is commonly used in *single-page applications* (SPAs), which load once and then handle all interactions without refreshing the page. These apps often generate multiple XHR requests—typically HTTP `POST` or `GET` calls—based on user actions.
133
+
134
+
Sumo Logic provides monitoring coverage for XHR interactions, including the following performance timings:
135
+
136
+
### `browser_time_to_first_xhr`
137
+
138
+
Time from the UI interaction until the first HTTP POST appears.
139
+
140
+
### `browser_time_to_last_xhr`
141
+
142
+
Time from the UI interaction until the last HTTP POST ends.
143
+
144
+
### `browser_time_to_xhr_processing_end`
145
+
146
+
Time from the UI interaction until all browser-side processing of all XHR requests is completed.
147
+
148
+
### `browser_time_in_xhr_calls`
149
+
150
+
The total time when the transaction was “busy” executing XHR communication.
151
+
152
+
In addition to these metrics, the system also measures how many XHR requests have been generated and identifies the user action that triggered the XHRs by blending the UI interaction (e.g., `“click on Pay”`) with the page name (e.g., `http://www.acme.com/checkout`). This results in an action name like `"Click on Pay on http://www.acme.com/checkout"`. Any erroneous HTTP responses to XHR POST calls are counted as XHR errors.
153
+
154
+
We also measure any erroneous HTTP responses to XHR POST calls, counting them as XHR errors, and provide drill-down capabilities via EI to specific traces that explain the full process of loading and executing each transaction.
155
+
156
+
<img src={useBaseUrl('img/rum/xhr-action.png')} alt="Interface for monitoring XHR interactions, displaying performance timings and metrics for XMLHttpRequests within a web application" style={{border: '1px solid gray'}} />
157
+
158
+
<!--
159
+
### Navigation (Route Change) Metrics
160
+
Another browsing technique used by single-page apps is a special way of handling page navigation (e.g., clicking on links, buttons) called route change. It is basically a way to navigate to a new page/view without having to load a new document.
161
+
Every time we open a new tab in Sumo, we do a route change (but we are not loading the whole document at the same time). Such actions typically also generate some XHR calls in the background. What we do with this is:
162
+
* Create a special type of user actions called `route_changes` with the name of the page that is being opened (i.e., “Route to [https://service.us2.sumologic.com/ui#/search/*](https://service.us2.sumologic.com/ui#/search/*)”)
163
+
* Show these actions as third type of action next to document loads and XHR requests
164
+
* Measure same type of metrics for them as for XHR requests
165
+
* Allow drill-down via EI to specific traces that explain full process of loading and execution of each such transaction
166
+
<img src={useBaseUrl('img/rum/nav-action.png')} alt="Real User Monitoring" />
167
+
-->
168
+
124
169
## Longtask delay metrics
125
170
126
171
This section describes how to trace and measure [Longtask delays](https://github.com/w3c/longtasks), which is when the main browser UI thread becomes locked for extended periods (greater than 50 milliseconds) and blocks other critical tasks (including user input) from being executed.
0 commit comments