@vartio/react-native

OpenTelemetry-based application intelligence for React Native. Traces, logs, crashes, and app-lifecycle telemetry, wrapped into a small API so a React Native app gets RED metrics, operation hotspots, and crash-free release health without hand-rolling @opentelemetry/js wiring.

Install

npm install @vartio/react-native
npm install @opentelemetry/api @opentelemetry/api-logs

react-native is a peer dependency (whatever version your app is already on). react-native-device-info is optional — install it to unlock startMemoryMonitoring() and the device.model.identifier attribute; the SDK no-ops with a warning if it's missing.

Quick start

import { Vartio } from "@vartio/react-native";

Vartio.start({
  endpoint: "https://your-otlp-backend/otlp/{monitorID}", // bare URL, no /v1/traces suffix
  token: "<ingest_token>",
  serviceName: "myapp-rn",
  serviceVersion: appVersion,
  environment: __DEV__ ? "development" : "production",
});

Vartio.installGlobalErrorHandler();
global.fetch = Vartio.wrapFetch((url) => url.replace(/\/products\/\d+/, "/products/:id"));

const navigationRef = useNavigationContainerRef();
const tracking = Vartio.trackNavigationContainer(navigationRef);

<NavigationContainer ref={navigationRef} {...tracking}>

What lights up

| SDK call | Surface | | --- | --- | | Vartio.start(options) | Service appears in Intelligence; session.start begins release-health accounting. | | Vartio.withSpan(name, fn, attributes?, classify?) | RED metrics, operation hotspots. | | Vartio.log(severity, body, attributes?) | Logs, error-log alerting. | | Vartio.recordCrash(info) / Vartio.installGlobalErrorHandler() | Crash list, crash-free release health. | | Vartio.recordScreenLoad(name, fn) | Operation hotspots, per-screen. | | Vartio.recordNavigation(from, to) / Vartio.trackNavigationContainer(ref) | Operation hotspots, navigation flow. | | Vartio.startMemoryMonitoring(intervalMs?) | Memory chart, per version/model/OS cohort. | | Vartio.wrapFetch(urlTemplate?) | RED metrics, operation hotspots, for outbound HTTP calls. | | Vartio.getTracer() / Vartio.getLogger() | Escape hatch for anything the wrapped API doesn't cover (e.g. backdated app.launch/app.tti spans). |

The full contract behind these calls — what each attribute means, and what silently breaks if it's skipped — is in docs/CONVENTIONS.md.

Works with any OTLP backend

This SDK is a thin, opinionated layer over the standard @opentelemetry/js packages. Vartio.start() takes a bare OTLP endpoint URL and a bearer token — point it at any backend that speaks OTLP/HTTP for traces, logs, and metrics, and the spans, logs, and attributes described in docs/CONVENTIONS.md will ingest and mean the same thing there as anywhere else. Nothing about the wire format is Vartio-specific.

Built for Vartio. The naming conventions this SDK enforces — session.id on every log, the reduced metrics resource for memory, the event.name = "device.crash" shape — exist because Vartio's mobile monitor type reads them to compute crash-free rate, per-cohort memory charts, and operation hotspots automatically, with no manual dashboard construction. Vartio is EU-hosted app intelligence: infrastructure and application telemetry, and data, stay in the EU. If you're already sending server or Kubernetes telemetry to Vartio, this SDK gets a mobile client onto the same Intelligence page.

Security note: wrapFetch strips query strings by default

Query strings routinely carry secrets — presigned-URL signatures, API keys, session tokens. Vartio.wrapFetch()'s default span label is origin + pathname only, with the query string and fragment stripped, specifically so those secrets never ship into span names or backend storage. Passing a urlTemplate callback gives you the full raw URL, query string included — at that point you own the decision of what's safe to put in a label.

Crash symbolication

installGlobalErrorHandler() catches JS-level fatal exceptions, but the stack it reports is the raw Hermes stack — not automatically readable. Upload a Metro source map per build (--sourcemap-output, gzipped, tagged with the same app.build.uuid your build sets) from CI right after each release build to get symbolicated crashes. See "What actually gets symbolicated" in docs/CONVENTIONS.md.

Maturity

0.x — the API may still change between minor versions. Pin an exact version if that matters to you.

Development

npm install
npm run typecheck
npm test
npm run build

See CONTRIBUTING.md.

License

Apache-2.0