Skip to content

perf: switch to ESM by default#3688

Merged
ScriptedAlchemy merged 13 commits intomainfrom
perf/esm
Apr 15, 2025
Merged

perf: switch to ESM by default#3688
ScriptedAlchemy merged 13 commits intomainfrom
perf/esm

Conversation

@ScriptedAlchemy
Copy link
Copy Markdown
Member

@ScriptedAlchemy ScriptedAlchemy commented Apr 10, 2025 •
edited
Loading

Description

Before

remoteEntry.js size: 75K
gzip size: 22744 bytes 
brotli size: 20079 bytes

After

remoteEntry.js size: 70K
gzip size: 21733 bytes
brotli size: 19230 bytes

Related Issue

Types of changes

  • Docs change / refactoring / dependency upgrade
  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)

Checklist

  • I have added tests to cover my changes.
  • All new and existing tests passed.
  • I have updated the documentation.

@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Apr 10, 2025 •
edited
Loading

🦋 Changeset detected

Latest commit: 4e25717

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 32 packages
Name Type
@module-federation/inject-external-runtime-core-plugin Major
@module-federation/webpack-bundler-runtime Major
@module-federation/data-prefetch Major
@module-federation/runtime-tools Major
@module-federation/runtime-core Major
@module-federation/enhanced Major
bundle-size Minor
@module-federation/runtime Major
@module-federation/node Minor
@module-federation/sdk Major
@module-federation/esbuild Patch
@module-federation/rspack Major
@module-federation/nextjs-mf Patch
@module-federation/modern-js Major
@module-federation/rsbuild-plugin Major
@module-federation/storybook-addon Major
@module-federation/modernjsapp Patch
@module-federation/devtools Major
@module-federation/dts-plugin Major
@module-federation/retry-plugin Major
@module-federation/bridge-react Major
@module-federation/bridge-vue3 Major
@module-federation/cli Major
@module-federation/managers Major
@module-federation/manifest Major
@module-federation/utilities Patch
@module-federation/bridge-react-webpack-plugin Major
@module-federation/third-party-dts-extractor Major
@module-federation/bridge-shared Major
@module-federation/error-codes Major
create-module-federation Major
website-new Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@netlify
Copy link
Copy Markdown

netlify bot commented Apr 10, 2025 •
edited
Loading

✅ Deploy Preview for module-federation-docs ready!

Name Link
🔨 Latest commit 4e25717
🔍 Latest deploy log https://app.netlify.com/sites/module-federation-docs/deploys/67fdb9b55e5cce0008d5ec96
😎 Deploy Preview https://deploy-preview-3688--module-federation-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@ScriptedAlchemy ScriptedAlchemy marked this pull request as ready for review April 10, 2025 07:26
@ScriptedAlchemy ScriptedAlchemy merged commit c399b9a into main Apr 15, 2025
16 checks passed
@ScriptedAlchemy ScriptedAlchemy deleted the perf/esm branch April 15, 2025 02:32
@2heal1 2heal1 mentioned this pull request Apr 15, 2025
Merged
@darq37
Copy link
Copy Markdown

darq37 commented Jan 22, 2026

Hey, with this one, i get some weird errors.
The bug occurs because @module-federation/runtime is ESM-only, but Next.js tries to statically bundle it on the server, causing require() calls to fail and the federation runtime to partially initialize. This leads to corrupted module mappings, making moduleToHandlerMapping[id] undefined and triggering the shareKey destructuring error on the client.
The solution was to use esmExternals: 'loose', but this causes other sets of problems, causing my app to crash in dev environment randomly.
Any ideas how to solve it @ScriptedAlchemy?
I use const { registerRemotes, loadRemote } = require('@module-federation/enhanced/runtime'); in my [...slug].js for the remote modules as shown in the example of CSR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@2heal1 2heal1 2heal1 approved these changes

Assignees

No one assigned

Labels

change: perf

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@ScriptedAlchemy @darq37 @2heal1