Custom Views¶

The RUM browser SDK automatically creates a View when a user visits a new page or when the URL changes in a single-page application. When the view boundary, name, or URL needs to be controlled by the business, you can enable manual views.

Enable Manual Views¶

Set trackViewsManually: true during initialization:

<script
  src="https://static.truewatch.com/browser-sdk/v3/dataflux-rum.js"
  type="text/javascript"
></script>
<script>
  window.DATAFLUX_RUM &&
    window.DATAFLUX_RUM.init({
      applicationId: "<APPLICATION_ID>",
      site: "<PUBLIC_OPENWAY_URL>",
      clientToken: "<CLIENT_TOKEN>",
      trackViewsManually: true,
    })
</script>

After enabling, the SDK will no longer automatically create Views based on the browser URL. The application must call startView() on the first page and every time the business page switches.

Start a View¶

Specify only the name:

window.DATAFLUX_RUM &&
  window.DATAFLUX_RUM.startView({
    name: "product-detail",
  })

Starting from SDK 3.3.6, you can also specify the View URL:

window.DATAFLUX_RUM &&
  window.DATAFLUX_RUM.startView({
    name: "/products/:id",
    url: "/products/42?source=campaign",
    context: {
      page_group: "product",
    },
  })

url can be an absolute URL or a URL relative to the current page. The SDK uses this value to generate the View's url, url_path, and query context; if it cannot be resolved, it falls back to the browser's current URL.

startView() supports the following parameters:

You can also use a string shorthand:

window.DATAFLUX_RUM &&
  window.DATAFLUX_RUM.startView("product-detail")

Framework Router¶

For React, Vue, Angular, Next.js, and Nuxt applications, it is recommended to use the frontend framework plugin. The Router plugin will automatically take over manual views and call startView() after a successful route commit.

Do not use the Router plugin and startView() in business code to track the same route change, as this will generate duplicate views.

Notes¶

1. After enabling trackViewsManually, the first View also needs to be started by the application.
2. The View should be started when the corresponding business page begins to display, to avoid attributing resources, errors, and actions to the previous View.
3. View names should use route templates or stable business names, and avoid using high-cardinality values such as user IDs or order numbers directly.
4. Calling startView() alone will not trigger a page redirect; it will only switch the RUM View context.