Remove `browser/replay` from mobile bundles to lower bundle size

[krystofwoldrich]

Description

Metro currently doesn't support tree shaking out of the box. And so all @sentry/* dependencies are included in the final bundle.

Some packages can be easily excluded using the metro resolver options:

Current solution

const config = {
  resolver: {
    resolveRequest: (context, moduleName, platform) => {
      if (moduleName.includes('@sentry/replay')) {
        return { type: 'empty' };
      }
      return context.resolveRequest(context, moduleName, platform);
    },
  },
};

Proposed solution

Sentry Metro config will automatically remove web replay for mobile platforms and expose an option to remove it for web builds.

const { withSentryConfig } = require('@sentry/react-native/metro');

const m = mergeConfig(getDefaultConfig(__dirname), config);
module.exports = withSentryConfig(m, { includeWebReplay: true });

[krystofwoldrich]

• Bundle analysis with overview and steps to reproduce is part of sentry is too havy for JS bundle (adds 500Kb prod) #3826.

[vovkasm]

Just experimented with one of concurrent products... Only +40Kb to production JS bundle (mesuread with empty RN 0.73.8 app)... (

I would also like to add that this is not just the size in the bundle, it is a measurable slowdown at the start of the application, which is a very important metric for business.

[kahest]

@vovkasm thanks for the additional data 👍