How to implement performance monitoring in React Native?

Question

Accepted Answer

**Performance monitoring** — track app performance metrics.

**Perf Monitor (development):**
```tsx
import { PerformanceObserver } from 'react-native';

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    console.log(`${entry.name}: ${entry.duration}ms`);
  });
});

observer.observe({ type: "measure", buffered: true });
```

**Custom timing:**
```tsx
function measureRender(componentName: string) {
  const startTime = performance.now();

return () => {
    const endTime = performance.now();
    console.log(`${componentName}: ${endTime - startTime}ms`);
  };
}

// Usage
const endMeasure = measureRender("MyComponent");
// ... render component
endMeasure();
```

**Third-party tools:**
- **Flipper** — React Native debugger.
- **Sentry** — error tracking.
- **Firebase Performance** — metrics.
- **React Native Profiler** — React DevTools.

**Key metrics to monitor:**
- FPS (frames per second).
- Memory usage.
- App startup time.
- Network requests.

React Native: How to implement performance monitoring in React Native?