Why bundle size of remoteEntry.js is so big?

[maitrungduc1410]

This is my rsbuild.config.ts for a React remote:

import { defineConfig } from "@rsbuild/core";
import { pluginReact } from "@rsbuild/plugin-react";
import { ModuleFederationPlugin } from "@module-federation/enhanced/rspack";

export default defineConfig({
  plugins: [pluginReact()],
  server: {
    port: 3002,
  },
  dev: {
    assetPrefix: true,
  },
  tools: {
    rspack: {
      output: {
        uniqueName: "react_mfe_app",
      },
      plugins: [
        new ModuleFederationPlugin({
          name: "react_mfe_app",
          exposes: {
            ReactAppLoader: "./src/loader.ts",
          },
          shared: {
            react: {
              singleton: true,
            },
            "react-dom/client": {
              singleton: true,
            },
          },
          filename: "remoteEntry.js",
        }),
      ],
    },
  },
});

as shown above it exposes ./src/loader.ts. This is the loader file:

import App from './App.tsx';

export default {
  framework: 'react',
  component: App,
  title: 'My React App',
}

My App.tsx component:

import "./App.css";
import reactLogo from "../public/react.svg?inline";
import rsPackLogo from "../public/rspack.png";

const App = () => {
  return (
    <div className="content">
      <h1>Rsbuild with React</h1>
      <p>Start building amazing things with Rsbuild.</p>
      <div>
        <img src={reactLogo} alt="React Logo" width={50} />
      </div>
      <div>
        <img src={rsPackLogo} alt="React Logo" height={100} />
      </div>
    </div>
  );
};

export default App;

it's pretty simple.

at run time this is what I have:

as you can see, the remoteEntry.js of React (rsbuild) very big compare to Angular (Webpack - ModuleFederationPlugin) and Vue (Vite - @module-federation/vite):

• React: 76KB
• Angular: 28KB
• Vue: 1KB

The reason is, bigger remoteEntry.js leads to slower MFE loading. Let say for Vue remoteEntry.js above is just 1KB, and I can implement my own async loading strategy to improve its sub resources loading time