[V5] Bundle size regression: Repack v5 + Rspack + MF2 produces 3-5x larger bundles

[longb1997]

Describe the bug

After upgrading from Repack v3 to Repack v5, we're experiencing a significant bundle size regression where the new setup produces bundles that are 3-5 times larger than the previous version.

System Info

OS: macOS 15.2
  CPU: (10) arm64 Apple M4
  Memory: 685.73 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.18.3
    path: ~/.nvm/versions/node/v20.18.3/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v20.18.3/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v20.18.3/bin/npm
  Watchman:
    version: 2025.02.10.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /Users/mobile/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.2
      - iOS 18.2
      - macOS 15.2
      - tvOS 18.2
      - visionOS 2.2
      - watchOS 11.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.3 AI-243.22562.218.2431.13114758
  Xcode:
    version: 16.2/16C5032a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 11.0.26
    path: /usr/bin/javac
  Ruby:
    version: 3.1.2
    path: /Users/mobile/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.1.3
    wanted: 15.1.3
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.76.9
    wanted: 0.76.9
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: false

Re.Pack Version

5.1.2

Reproduction

https://github.com/longb1997/bundle-size-issue

Steps to reproduce

Follow README of the repo

[jbroma]

hey @longb1997

the difference is huge - it looks like minimizer is not setup properly for Rspack.

can you please try adding these lines to your config?

// rspack.config.mjs
import TerserPlugin from 'terser-webpack-plugin';

export default {
  // ...
  optimization: {
    /** Enables minification based on values passed from React Native Community CLI or from fallback. */
    minimize,
    minimizer: [
      new TerserPlugin({
        test: /\.(js)?bundle(\?.*)?$/i,
        extractComments: false,
        terserOptions: {
          format: {
            comments: false,
          },
        },
      }),
    ],
    /** Configure minimizer to process the bundle. */
    chunkIds: 'named',
  },
};

you might need to install terser-webpack-plugin into your project

note: this is pretty much equal to default used in webpack and it will work in both rspack and webpack

[jbroma]

@longb1997 did that help?

[longb1997]

@longb1997 did that help?

Sorry, I haven’t tried it yet. I’ll update you as soon as I can. Thanks so much for your support

[longb1997]

worked like a charm. Thank you so much

@longb1997 did that help?

[longb1997]

https://re-pack.dev/docs/migration-guides/rspack#removeterserplugin-import-and-configuration
@jbroma
Oh, I saw it mentioned in the repack doc and it was required to be removed when migrating from webpack to rspack. Might need to update this part?

[mefjuu]

It's interesting that putting into the config

    minimizer: [
      new TerserPlugin({
        test: /\.(js)?bundle(\?.*)?$/i,
      }),
    ],

results with minified bundle while the following doesn't

    minimizer: [
      new rspack.SwcJsMinimizerRspackPlugin({
        test: /\.(js)?bundle(\?.*)?$/i,
      }),
    ],

[jbroma]

re-pack.dev/docs/migration-guides/rspack#removeterserplugin-import-and-configuration @jbroma Oh, I saw it mentioned in the repack doc and it was required to be removed when migrating from webpack to rspack. Might need to update this part?

the docs are actually correct - we should be using SwcJsMinimizerRspackPlugin but I believe there was some incompatibility there that needed fixing. The Terser should be treated as a workaround for now

[jbroma]

It's interesting that putting into the config

    minimizer: [
      new TerserPlugin({
        test: /\.(js)?bundle(\?.*)?$/i,
      }),
    ],

results with minified bundle while the following doesn't

    minimizer: [
      new rspack.SwcJsMinimizerRspackPlugin({
        test: /\.(js)?bundle(\?.*)?$/i,
      }),
    ],

Interesting - SwcJsMinimizerRspackPlugin should be working when set like this, did you manage to pinpoint the root cause of that?

[mefjuu]

Interesting - SwcJsMinimizerRspackPlugin should be working when set like this, did you manage to pinpoint the root cause of that?

@jbroma No. I've also applied Terser workaround.