Datadog RUM

This topic explains how to send LaunchDarkly feature flag evaluation data to Datadog Real User Monitoring (RUM) and how to use that data once it arrives.

Datadog is an observability service for cloud-scale applications. It monitors servers, databases, tools, and services through a Software as a Service (SaaS) data analytics platform. Datadog’s RUM product monitors the performance and behavior of your front-end applications. Datadog’s LaunchDarkly RUM integration lets you send feature flag evaluation data from the LaunchDarkly JavaScript SDK to Datadog as event properties. When you send this data to RUM, you can correlate feature releases with user experience, error rates, and Core Web Vitals.

Prerequisites

You need the following things to complete this procedure:

• The LaunchDarkly JavaScript SDK installed and initialized in your application
• Datadog RUM Browser SDK version 4.25.0 or higher, with RUM browser monitoring set up
• Your LaunchDarkly client-side ID

Set up feature flag data collection

To send feature flag evaluation data from LaunchDarkly to Datadog, configure both SDKs: the Datadog RUM SDK to accept feature flag data, and the LaunchDarkly JavaScript SDK to report evaluations to Datadog as they happen.

Enable feature flags in the Datadog RUM SDK

First, configure the Datadog RUM SDK to collect feature flag data. Add the enableExperimentalFeatures initialization parameter with the value ["feature_flags"]:

1
import { datadogRum } from '@datadog/browser-rum';
2
3
datadogRum.init({
4
  applicationId: '<DATADOG_APPLICATION_ID>',
5
  clientToken: '<DATADOG_CLIENT_TOKEN>',
6
  site: '<DATADOG_SITE>',
7
  // service: 'my-web-application',
8
  // env: 'production',
9
  // version: '1.0.0',
10
  enableExperimentalFeatures: ["feature_flags"],
11
  sessionSampleRate: 100,
12
  sessionReplaySampleRate: 20,
13
  trackUserInteractions: true,
14
  trackResources: true,
15
  trackLongTasks: true,
16
});

Report flag evaluations from the LaunchDarkly SDK

Next, initialize the LaunchDarkly JavaScript SDK with an inspectors configuration option. Inspectors let the SDK notify other systems, like Datadog, each time it evaluates a flag.

Add a flag-used inspector that calls Datadog’s addFeatureFlagEvaluation method for every flag evaluation. Here is an example:

1
import * as LDClient from 'launchdarkly-js-client-sdk';
2
import { datadogRum } from '@datadog/browser-rum';
3
4
const context = {
5
  kind: 'user',
6
  key: 'example-user-key',
7
  name: 'Sandy',
8
  email: 'sandy@testcorp.com'
9
};
10
11
const client = LDClient.initialize('enter-your-client-side-id-here', context, {
12
  inspectors: [
13
    {
14
      type: 'flag-used',
15
      name: 'dd-inspector',
16
      method: (key, detail) => {
17
        datadogRum.addFeatureFlagEvaluation(key, detail.value);
18
      },
19
    },
20
  ],
21
});

Every time your application evaluates a flag through this client, the inspector sends the flag’s key and evaluated value to Datadog as a feature flag evaluation.

Review your feature flag data

After you configure both SDKs, Datadog associates flag evaluations with the RUM sessions, views, and errors where they occur.

Use the Feature Flag Tracking tab

Open the Feature Flag Tracking tab within RUM to see a list of your feature flags along with summary statistics for each one.

Each flag has one of three statuses:

• Active: The flag evaluated more than one variant over the past two weeks.
• Inactive: The flag only evaluated its control variant over the past two weeks.
• Out to 100%: The flag only evaluated one of its non-control variants over the past two weeks.

Click a flag in the list to open its feature flag analysis page, which has the following tabs:

• The Users tab shows summary statistics about the users who encountered each variant of the flag.
• The Issues tab shows errors that occurred in sessions where the flag evaluated. Use this tab to check whether an error is related to a specific variant.
• The Performance tab shows Core Web Vitals and loading time for each variant, so you can determine whether a variant affects your application’s performance.

Query flag data in the RUM Explorer

To build custom views of your flag data, use the RUM Explorer with the @feature_flags.{flag_name} attribute. Search your Sessions, Views, or Errors, and scope your queries to sessions where a specific flag evaluated.

For example, if you want to measure how a new checkout flow affects conversion rate, group a conversion rate graph by @feature_flags.{flag_name} to compare each variant.

Further reading

• To learn more about setting up feature flag tracking for other SDK platforms, read Datadog’s Setup Feature Flag Tracking documentation.
• For an example of remotely configuring your RUM initialization settings using LaunchDarkly flags, read Datadog’s guide Remotely configure RUM using LaunchDarkly.
• To learn more about SDK hooks and inspectors, read Inspectors in the JavaScript SDK reference guide.