DEV Community

Cover image for Sentry Crash & ANR Monitoring in React Native: A Practical Setup Guide
Amit Kumar
Amit Kumar

Posted on

Sentry Crash & ANR Monitoring in React Native: A Practical Setup Guide

Application crashes are inevitable, but understanding why they happen and how often they occur is what improves app quality.

In our React Native application, we use Sentry to monitor crashes, Application Not Responding (ANR) events, and session stability. This allows us to identify issues quickly, reduce crash rates, and improve the overall user experience.

Why Sentry?

Sentry provides much more than a simple crash log. It helps answer questions like:

  • Which users are experiencing crashes?
  • Which app version introduced the issue?
  • What actions were performed before the crash?
  • How many sessions completed successfully without crashing?
  • Was the issue caused by JavaScript, native Android, or native iOS code?

Instead of relying on user feedback, Sentry provides detailed diagnostics in real time.


Sentry Initialization

export const sentryInitialize = () => {
  try {
    Sentry.init({
      debug: true,
      maxBreadcrumbs: 50,
      dsn: "YOUR_DSN_LINK",
      tracesSampleRate: 1.0,
      attachScreenshot: true,
      patchGlobalPromise: false,
      environment:"production/development",
      enableAutoSessionTracking: true,
    });

    console.log("Sentry initialized for crash & ANR tracking");
  } catch (error) {
    console.log("Sentry initialization failed:", error?.message);
  }
};
Enter fullscreen mode Exit fullscreen mode

Initializing Sentry at App Startup

In our application, we initialize Sentry from the application's entry point (index.js).

import { sentryInitialize } from "./src/config/sentry";

sentryInitialize();

AppRegistry.registerComponent(appName, () => App);
Enter fullscreen mode Exit fullscreen mode

Top comments (0)