App performance greatly reduced by `captureConsoleIntegration`

[yefim]

OS:

• [ ] Windows
• [ ] MacOS
• [ ] Linux

Platform:

• [x] iOS
• [ ] Android

SDK:

• [x] @sentry/react-native (>= 1.0.0)
• [ ] react-native-sentry (<= 0.43.2)

SDK version: 5.26.0

react-native version: 0.74.6

Are you using Expo?

• [x] Yes
• [ ] No

Are you using sentry.io or on-premise?

• [x] sentry.io (SaaS)
• [ ] on-premise

Configuration:

(@sentry/react-native)

  Sentry.init({
    dsn: process.env.EXPO_PUBLIC_SENTRY_DSN,
    enableInExpoDevelopment: false,
    enabled: !IS_DEV_BUILD,
    debug: IS_DEV_BUILD,
    environment: `app:${APP_ENV}`,
    integrations: [captureConsoleIntegration({ levels: ['error', 'assert'] })],
    ignoreErrors: [
      'Amplitude Logger [Error]',
      'ViewPropTypes will be removed from React Native',
      'POP_TO_TOP',
    ],
  });

---

I have the following issue:

After upgrading @sentry/integrations from "7.81.1" to "7.114.0" we noticed a large performance regression. The app was taking a long time to respond to a user's tap.

Before (@sentry/integrations 7.81.1)

https://github.com/user-attachments/assets/8407ac65-5edc-4c0a-858a-413d8692c300

After (@sentry/integrations 7.114.0)

https://github.com/user-attachments/assets/a64538df-236f-4028-aca2-dc4270b5d690

When we enabled Sentry in dev, we saw a bunch of logs that were clogging up the console and were able to reproduce the unresponsiveness locally. I've uploaded a video at https://github.com/getsentry/sentry-react-native/issues/3963#issuecomment-2265966871

Steps to reproduce:

• Enable captureConsoleIntegration integration
• Try navigating around the app

Actual result:

App is slow to respond to user's tap.

Expected result:

App navigates as normal

[kahest]

@yefim thank you for the detailed report and the videos, we appreciate the effort. Do you know if this also occurs on Android, or only on iOS?

[yefim]

Yes, seeing the same against Android in development.

https://github.com/user-attachments/assets/6ed9f86c-cbf9-4d95-8d25-7f6d20553b14

Here's the code diff:

[krystofwoldrich]

@yefim Thank you for the details, we will investigate it.

[lucas-zimerman]

It can be reproduced on the React Native sample by using the following init:

Sentry.init({
  // Replace the example DSN below with your own DSN:
  dsn: SENTRY_INTERNAL_DSN,
  debug: true,
  environment: 'dev',
  integrations(integrations) {
    integrations.push(
      captureConsoleIntegration({ levels: ['error', 'assert'] }),
    );
    return integrations;

  },
});

It seems like when we add the level 'assert' all this block appears, I noticed that there are loads of symbolication calls when this happens and navigation is surely almost impossible todo on the app. On the JavaScript debug log things seems calm but on logcat there is a nonstop calls to symbolicate

EDIT: I replaced the assert callback and this is the message + stacktrace from where it was being called.

 LOG  Assertion called: true  message 'this' is expected an Event object, but got [{"isTrusted":false}] stack : Error
    at getCurrentStackTrace (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:125938:26)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:125950:57)
    at apply (native)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:154465:27)
    at pd (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:36235:19)
    at setPassiveListener (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:36640:7)
    at dispatchEvent (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:36939:27)
    at setReadyState (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:36129:27)
    at open (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:36041:27)
    at apply (native)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:155583:34)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:29261:17)
    at tryCallTwo (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:204678:9)
    at doResolve (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:204817:25)
    at Promise (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:204697:14)
    at fetch (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:29218:25)
    at ?anon_0_ (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28649:33)
    at next (native)
    at asyncGeneratorStep (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28665:26)
    at _next (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28684:29)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28689:14)
    at tryCallTwo (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:204678:9)
    at doResolve (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:204817:25)
    at Promise (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:204697:14)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28681:25)
    at apply (native)
    at _symbolicateStackTrace (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28658:40)
    at apply (native)
    at symbolicateStackTrace (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28637:40)
    at symbolicate (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28616:52)
    at handleSymbolicate (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28516:42)
    at symbolicate (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28507:33)
    at appendNewLog (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28152:25)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:28196:21)
    at apply (native)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:35288:26)
    at _callTimer (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:35167:17)
    at _callReactNativeMicrotasksPass (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:35212:17)
    at callReactNativeMicrotasks (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:35418:44)
    at __callReactNativeMicrotasks (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:3569:48)
    at anonymous (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:3342:45)
    at __guard (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:3541:15)
    at flushedQueue (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:3341:21)
    at callFunctionReturnFlushedQueue (http://10.0.2.2:8081/index.bundle//&platform=android&dev=true&lazy=true&minify=false&app=io.sentry.reactnative.sample&modulesOnly=false&runModule=true:3326:33)

https://sentry-sdks.sentry.io/issues/5718158513

[lucas-zimerman]

I am stil looking at it, but in the meantime I have an update that this issue is no longer happening on @sentry/react-native version 6.0.0 or newer. The fix was implemented here: https://github.com/getsentry/sentry-javascript/pull/11799/files#diff-54a4bb3b994992c0392eba31977780bac7892c266a8b0998ca213331a1eb57adR67

EDIT: It seems like the issue lies on this library used by React Native: https://gitlab.cin.ufpe.br/vrs2/iot-trafficlight-final/-/blob/main/node_modules/event-target-shim/dist/event-target-shim.mjs?ref_type=heads#L42-44

The symbolication code uses a fetch code that relies on this library, and with that it creates those assert messages, and since we are creating events with the fetched event, we will end up on a loop.

We ignore those events on the integration but it would be nice to shield it better against such issues in the future

[antonis]

I am stil looking at it, but in the meantime I have an update that this issue is no longer happening on @sentry/react-native version 6.0.0 or newer.

@lucas-zimerman Should we close this issue given that our latest two major versions have a fix for this issue?

[lucas-zimerman]

Sounds good to me, closing this as fixed on the latest two major releases.