@epsilondeltaco/ep-orion-rn
v1.5.4
Published
React Native performance monitoring and analytics SDK with startup metrics, error tracking, and network monitoring
Readme
readme_content = """# Orion RN Library (@epsilondeltaco/ep-orion-rn)
Orion RN is a lightweight React Native instrumentation library that tracks screen navigation, TTID/TTFD metrics, network requests, errors, and lifecycle events with minimal setup.
✨ Features
- Auto-captures screen beacons (time-to-initial-display, time-to-full-display).
- Tracks network requests (fetch/XHR).
- Deduplicated error tracking.
- Lifecycle beacons (foreground/background/exit).
- Configurable sampling + debug logging.
📦 Installation
npm install @epsilondeltaco/ep-orion-rn
# or
yarn add @epsilondeltaco/ep-orion-rn🚀 Usage
App.tsx (Quick Start)
import React, { useEffect, useRef } from 'react';
import { NavigationContainer } from '@react-navigation/native';
import RootNavigator from './src/navigation/RootNavigator';
import ErrorBoundary from './src/components/ErrorBoundary';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { enableScreens } from 'react-native-screens';
import { Orion } from '@epsilondeltaco/ep-orion-rn';
enableScreens(true);
export default function App() {
const navRef = useRef<any>(null);
const navHandlersRef = useRef<{onReady: () => void; onStateChange: () => void} | null>(null);
const didSetupRef = useRef(false);
useEffect(() => {
if (didSetupRef.current) return;
didSetupRef.current = true;
Orion.init({
cid: '0002317',
pid: '0003',
env: 'dev',
appName: 'OrionRnDemo',
debug: true,
sampleRate: 1,
// beaconUrl: 'https://your-endpoint'
}).then(() => {
navHandlersRef.current = Orion.attachNavigation(navRef);
});
}, []);
return (
<GestureHandlerRootView style={{flex: 1}}>
<ErrorBoundary onError={(e) => Orion.captureError(e, 'UIBoundary')}>
<NavigationContainer
ref={navRef}
onReady={() => navHandlersRef.current?.onReady()}
onStateChange={() => navHandlersRef.current?.onStateChange()}
>
<RootNavigator />
</NavigationContainer>
</ErrorBoundary>
</GestureHandlerRootView>
);
}Optional: Mark screen as fully drawn
If your screen loads async content (e.g., API calls), you can mark it fully drawn for precise TTFD:
useEffect(() => {
Orion.markFullyDrawn();
}, []);⚙️ Config Options
| Option | Type | Default | Description |
|------------------|-----------|---------|-------------|
| cid | string | — | Client ID (required) |
| pid | string | — | Project ID (required) |
| env | string | dev | Environment (dev/staging/prod) |
| appName | string | — | App name |
| sampleRate | number | 1 | % of sessions to sample (0–1) |
| debug | boolean | false | Enable console logs |
| beaconUrl | string | — | Beacon endpoint |
| errorCooldownMs| number | 20000 | Error deduplication window (ms) |
| ttfdIdleWindowMs| number | 1200 | Idle window for TTFD heuristic |
| ttfdTimeoutMs | number | 6000 | Max timeout for TTFD heuristic |
📊 Example Beacon Payload
{
"cid": "0002317",
"pid": "0003",
"env": "dev",
"appName": "OrionRnDemo",
"sessionId": "uuid",
"meta": {
"platform": "android",
"osVersion": "36"
},
"beacons": [
{
"type": "screen",
"screen": "ProductDetail",
"prevScreen": "ProductList",
"enteredAt": 1759141679630,
"leftAt": 1759141795754,
"ttid": 320,
"ttfd": 1206,
"fullyDrawn": false,
"net": [
{
"url": "https://fakestoreapi.com/products",
"method": "GET",
"status": 200,
"duration": 1010,
"bytesIn": 10634
}
]
}
]
}📝 License
MIT © [Epsilon Delta] """
with open("/mnt/data/README.md", "w") as f: f.write(readme_content)
"/mnt/data/README.md"
