React Native RUM SDK

Real User Monitoring for React Native apps. Automatic instrumentation for sessions, views, network requests (fetch/XHR), errors, and resource metrics via OpenTelemetry. ANR detection is available on Android only.

The React Native SDK wraps the Android and iOS native SDKs. Each platform’s CDN repo must be configured so the native dependencies resolve.

Prerequisites

React Native >= 0.74
iOS 15.1+
Android minSdk 21 (Android 5.0+)
Native dependencies:
- Android: io.last9:rum-android:0.3.1 (resolved from CDN Maven)
- iOS: Last9RUM 0.3.1 (resolved from CDN podspec)

CDN artifacts

Artifact	URL
Tarball	`https://cdn.last9.io/rum-sdk/react-native/builds/0.3.1/last9-rum-react-native-0.3.1.tgz`
Checksum	`https://cdn.last9.io/rum-sdk/react-native/builds/0.3.1/last9-rum-react-native-0.3.1.tgz.sha256`

Staging builds use the -alpha.<run_number> suffix.

Installation

Install the package

npm install https://cdn.last9.io/rum-sdk/react-native/builds/0.3.1/last9-rum-react-native-0.3.1.tgz

Android — add the CDN Maven repository

In android/settings.gradle (or android/build.gradle):

dependencyResolutionManagement {
    repositories {
        google()
        mavenCentral()
        maven { url = uri("https://cdn.last9.io/rum-sdk/android/maven/") }
    }
}

iOS — add the Last9RUM podspec

In ios/Podfile:

pod 'Last9RUM', :podspec => 'https://cdn.last9.io/rum-sdk/ios/builds/0.3.1/Last9RUM.podspec'

Then install pods:

cd ios && pod install

Initialize the SDK

At app entry (before any screens render):

import { L9Rum } from "@last9/rum-react-native";

L9Rum.initialize({
  baseUrl: "https://otlp-ext-aps1.last9.io/v1/otlp/organizations/<org>",
  origin: "https://app.last9.io",
  clientToken: "your-client-token",
  serviceName: "my-rn-app",
  serviceVersion: "1.0.0",
  deploymentEnvironment: "production",
});

Configuration

L9Rum.initialize({
  // --- Required ---------------------------------------------------------

  // OTLP collector endpoint
  baseUrl: "https://otlp-ext-aps1.last9.io/v1/otlp/organizations/<org>",

  // Authentication token from Last9
  clientToken: "your-client-token",

  // Application identifier (maps to service.name)
  serviceName: "my-rn-app",

  // App version string (maps to service.version)
  serviceVersion: "1.0.0",

  // Environment name
  deploymentEnvironment: "production",

  // --- Optional ---------------------------------------------------------

  // Origin sent as X-LAST9-ORIGIN header.
  // Required for client_monitoring tokens.
  origin: "https://app.last9.io",

  // Specific build identifier (maps to app.build_id)
  appBuildId: "1.0.0-build-42",

  // Unique per-install ID (NOT a hardware ID). Persists across launches.
  appInstallationId: undefined,

  // Session sampling rate: 0-100 (percentage). 100 = sample everything.
  sampleRate: 100,

  // Print debug logs to console
  debugLogs: false,

  // Automatically intercept fetch/XHR requests
  networkInstrumentation: true,

  // Automatically capture unhandled JS errors
  errorInstrumentation: true,

  // Max spans per export batch
  maxExportBatchSize: 100,

  // Export timeout in milliseconds
  exportTimeoutMs: 30000,

  // ANR detection (Android only)
  anrDetectionEnabled: true,
  anrThresholdMs: 5000,

  // Periodically sample memory and CPU
  resourceMonitoringEnabled: true,
  resourceSamplingIntervalMs: 30000,

  // When true, each HTTP request gets its own traceId
  // instead of sharing the current view's traceId
  isolateTracePerRequest: false,

  // Custom resource attributes added to every span
  resourceAttributes: {
    "app.platform": "react-native",
  },

  // W3C Baggage propagation on outgoing requests
  baggage: {
    enabled: false,
    allowedKeys: ["session.id", "user.id"],
    maxTotalBytes: 8192,
    warnAtPercentage: 80,
  },
});

API reference

For automatic view tracking with React Navigation:

import { L9ReactNavigationInstrumentation } from '@last9/rum-react-native';
import { NavigationContainer } from '@react-navigation/native';

function App() {
  return (
    <NavigationContainer
      onStateChange={L9ReactNavigationInstrumentation.onStateChange}
    >
      {/* screens */}
    </NavigationContainer>
  );
}

Identify a user

L9Rum.identify({
  id: "user-123",
  name: "Jane",
  email: "jane@example.com",
  fullName: "Jane Doe",
  roles: ["admin"],
});

Clear user on sign-out

L9Rum.clearUser();

Capture errors

try {
  // risky operation
} catch (error) {
  L9Rum.captureError(error, { screen: "checkout" });
}

Track views manually

L9Rum.startView("ProductDetailsScreen");
L9Rum.setViewName("Product #42");

Custom events

L9Rum.addEvent("purchase_completed", {
  product_id: "12345",
  amount: 29.99,
});

Global span attributes

L9Rum.spanAttributes({
  experiment: "checkout_v2",
  feature_flag: "new_cart",
});

// Clear
L9Rum.spanAttributes(null);

Session ID

const sessionId = await L9Rum.getSessionId();

Flush pending data

L9Rum.flush();

Next steps

Once data is flowing, explore it in Discover > Applications — performance, errors, and sessions.

Troubleshooting

Please get in touch with us on Discord or Email if you have any questions.