Monitoring code: The JavaScript code that provides RUM capabilities such as capturing user actions.
Configuration: The application configuration that is initially used by the monitoring code. It is updated later via the RUM beacon response in case of configuration changes.
Dynatrace RUM provides several snippet formats that integrate these components into your pages in different ways, each tailored to meet specific requirements.
If you want to leverage the subresource integrity (SRI) browser feature to ensure that the monitoring code hasn't been altered, use OneAgent JavaScript tag with SRI for manual insertion and automatic injection.
To avoid parse-blocking execution of the monitoring code, configure the Script execution option of your selected snippet format to async or defer. Instructions for configuring this option are provided in the documentation for each individual snippet format below. Keep in mind that while the monitoring code is not yet fully loaded and initialized, certain timings and user actions will be lost.
Available snippet formats
JavaScript tag links to an external file that includes both the monitoring code and the configuration. JavaScript tag is only available for manual insertion.
Updates
The short cache duration used for the external file ensures regular automatic updates, making JavaScript tag an ideal choice if you don't want to take care of updating the inserted snippet after configuration changes.
Monitoring code source
The external file is loaded from the Dynatrace CDN.
Cache duration
The external file containing monitoring code and configuration is updated according to its cache duration, which is one hour by default and can be configured. The available values are low—a few hours or days—to ensure the configuration is updated regularly. The cache duration specifies how long browsers can cache the file. The Dynatrace CDN caches it for one hour.
To configure the cache duration
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Manual insertion.
In the JavaScript tag section, use the dropdown under Cache monitoring code and configuration for to select the required cache duration.
Script execution
By default, the monitoring code is loaded and executed synchronously by the browser. To avoid parse-blocking behavior, you can configure the addition of the async or defer attributes.
With the async attribute, the monitoring code is loaded in parallel with page parsing and executed immediately once it’s available.
With the defer attribute, the monitoring code is also loaded in parallel, but execution is deferred until after the page has finished parsing.
With both attributes, certain timings and user actions will be lost while the monitoring code is not yet fully loaded and initialized.
To configure script execution
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Manual insertion.
In the JavaScript tag section, set Script execution attribute to async, defer, or No attribute.
Copy the snippet and insert it into your page.
When fetching the JavaScript tag via the API, you can control script execution by passing a parameter. For details, see GET JavaScript tag.
Addition of the crossorigin="anonymous" attribute
🟢 Enabled by default
The external script referenced by JavaScript tag is served from the Dynatrace CDN, resulting in a cross-origin request. To enable the collection of detailed JavaScript error messages and W3C resource timings, you need to include the crossorigin="anonymous" attribute in the script tag.
To enable the addition of the crossorigin="anonymous" attribute
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Manual insertion.
In the JavaScript tag section, enable Add the crossorigin=anonymous attribute.
Copy the snippet and insert it into your page.
When fetching the JavaScript tag via the API, you can control the addition of the crossorigin="anonymous" attribute by passing a parameter. For details, see GET JavaScript tag.
OneAgent JavaScript tag includes the configuration and links to an external file containing the monitoring code. It's available for both manual insertion and automatic injection.
Updates
When inserting the OneAgent JavaScript tag manually, it must also be manually updated whenever configuration changes occur. To ensure it remains current, we recommend using it together with fully automated updates via the API. Using OneAgent JavaScript tag from the web UI is discouraged unless timely configuration updates are not critical.
In case of automatic injection, OneAgent always injects the OneAgent JavaScript tag using the current configuration. Note, however, that the caching policy of your application may influence how often OneAgent gets a chance to inject. For more information, see Cache control header optimizations.
Both browsers and the Dynatrace CDN can cache the monitoring code for up to a year. This extended cache duration is made possible by embedding both the RUM JavaScript version and a hash of the active modules in the file URL.
Script execution
By default, the monitoring code is loaded and executed synchronously by the browser. To avoid parse-blocking behavior, you can configure the addition of the async or defer attributes.
With the async attribute, the monitoring code is loaded in parallel with page parsing and executed immediately once it’s available.
With the defer attribute, the monitoring code is also loaded in parallel, but execution is deferred until after the page has finished parsing.
With both attributes, certain timings and user actions will be lost while the monitoring code is not yet fully loaded and initialized.
To configure script execution for automatic injection
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Automatic injection.
If Snippet format is set to OneAgent JavaScript tag, the Script execution attribute option becomes available. Choose either async, defer, or No attribute from the dropdown.
Select Save changes.
To configure script execution for manual insertion
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Manual insertion.
In the OneAgent JavaScript tag section, set Script execution attribute to async, defer, or No attribute.
Copy the snippet and insert it into your page.
When fetching the OneAgent JavaScript tag via the API, you can control script execution by passing a parameter. For details, see GET OneAgent JavaScript tag.
OneAgent JavaScript tag with SRI lets you take advantage of the subresource integrity (SRI) browser feature to ensure that the monitoring code hasn't been altered, see Use Subresource Integrity (SRI) for Real User Monitoring code. It includes configuration, a reference to an external file containing the monitoring code, and an integrity hash for this monitoring code. It is supported for both automatic injection and manual insertion.
Updates
When inserting the OneAgent JavaScript tag with SRI manually, it must also be manually updated whenever configuration changes occur. To ensure it remains current, we recommend using it together with fully automated updates via the API. Using OneAgent JavaScript tag with SRI from the web UI is discouraged unless timely configuration updates are not critical.
In case of automatic injection, OneAgent always injects the OneAgent JavaScript tag with SRI using the current configuration. Note, however, that the caching policy of your application may influence how often OneAgent gets a chance to inject. For more information, see Cache control header optimizations.
Monitoring code source
The monitoring code is always delivered by the Dynatrace CDN.
Cache duration
Both browsers and the Dynatrace CDN can cache the monitoring code for up to a year. This extended cache duration is made possible by embedding both the RUM JavaScript version and a hash of the active modules in the file URL.
Script execution
By default, the monitoring code is loaded and executed synchronously by the browser. To avoid parse-blocking behavior, you can configure the addition of the async or defer attributes.
With the async attribute, the monitoring code is loaded in parallel with page parsing and executed immediately once it’s available.
With the defer attribute, the monitoring code is also loaded in parallel, but execution is deferred until after the page has finished parsing.
With both attributes, certain timings and user actions will be lost while the monitoring code is not yet fully loaded and initialized.
To configure script execution for automatic injection
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Automatic injection.
If Snippet format is set to OneAgent JavaScript tag with SRI, the Script execution attribute option becomes available. Choose either async, defer, or No attribute from the dropdown.
Select Save changes.
To configure script execution for manual insertion
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Manual insertion.
In the OneAgent JavaScript tag with SRI section, set Script execution attribute to async, defer or No attribute.
Copy the snippet and insert it into your page.
When fetching the OneAgent JavaScript tag with SRI via the API, you can control script execution by passing a parameter. For details, see GET OneAgent JavaScript tag with SRI.
Inline code contains both the configuration and the RUM monitoring code, keeping the number of web requests at a minimum. Note that the Session Replay monitoring code is not inlined, so there will still be an additional request if you use Session Replay. If your website consists of many individual pages, using inline code may not be beneficial, as it increases the size of each document. However, it can be a suitable choice for single-page applications (SPAs).
API
If you use manual insertion, the API endpoint described in RUM JavaScript API - GET inline code allows you to integrate the addition of the inline code into your build scripts.
Updates
When inserting the inline code manually, it must also be manually updated whenever configuration changes occur. To ensure it remains current, we recommend using it together with fully automated updates via the API. Using inline code from the web UI is discouraged unless timely configuration updates are not critical.
In case of automatic injection, OneAgent always injects the inline code using the current configuration. Note, however, that the caching policy of your application may influence how often OneAgent gets a chance to inject. For more information, see Cache control header optimizations.
Monitoring code source
In case of agentless monitoring, the Session Replay monitoring code is delivered by the Dynatrace CDN. In case of automatic injection or manual insertion for pages of an auto-injected application, the Session Replay monitoring code is, by default, delivered by the OneAgent that instruments your application. Alternatively, it is also possible to load it from the Dynatrace CDN, see Request the monitoring code from the Dynatrace CDN.
Cache duration
Because the RUM monitoring code is inlined, its cache duration matches that of your page, which is determined by the cache settings on your web server. The Session Replay monitoring code can be cached for up to a year by both browsers and the Dynatrace CDN. This extended cache duration is made possible by embedding both the RUM JavaScript version and a hash of the active modules in the file URL.
Script execution
The monitoring code is loaded and evaluated synchronously by the browser.
Code snippet contains the configuration and the basic functionality of the monitoring code. It is available for both manual insertion and automatic injection.
In case of manual insertion, it injects another script element into the page that references an external file containing the full functionality of the monitoring code.
In case of automatic injection, this second script element is injected by OneAgent when it injects the code snippet.
The external file containing the full functionality of the monitoring code can be configured to load either synchronously or asynchronously using the defer attribute, see Script execution.
Updates
In case of manual insertion, monitoring code and configuration updates are available after the page has reloaded for the first time. To have the current configuration available from the start, the code snippet needs to be updated regularly. This is also necessary to guarantee the compatibility between the code snippet and the external file, which we test for one year.
In case of automatic injection, OneAgent always injects code snippet using the current configuration. Note, however, that the caching policy of your application may influence how often OneAgent gets a chance to inject. For more information, see Cache control header optimizations.
Monitoring code source
In case of agentless monitoring, the external file containing the full functionality of the monitoring code is delivered by the Dynatrace CDN. In case of automatic injection or manual insertion for pages of an auto-injected application, it is, by default, delivered by the OneAgent that instruments your application. Alternatively, it is also possible to load it from the Dynatrace CDN, see Request the monitoring code from the Dynatrace CDN.
Cache duration
The caching of the code snippet matches the caching of the page, which is determined by your web server configuration. The external file can be cached for up to a year by both browsers and the Dynatrace CDN. This extended cache duration is made possible by embedding both the RUM JavaScript version and a hash of the active modules in the file URL.
Script execution
The external file that provides the full functionality of the monitoring code can be configured to load either synchronously or asynchronously using the defer attribute. When loaded asynchronously, the script is downloaded in parallel with the HTML parsing and executed only after the entire document has been fully parsed. While the monitoring code is not yet fully loaded, certain timings and user actions will be lost.
To configure script execution for manual insertion
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Manual insertion.
In the Code snippet section, use the dropdown under Load the monitoring code to select either synchronously or deferred.
Copy the snippet and insert it into your page.
To configure script execution for automatic injection
Go to Web.
Select the application that you want to configure.
In the upper-right corner of the application overview page, select More (…) > Edit.
From the application settings, select Injection > Automatic injection.
Under Snippet format, select Code snippet.
Under Load the monitoring code, select the option synchronously or deferred.