概要
Module Federation 2.0が正式に安定版リリースを迎えた。本プロジェクトはwebpack 5で初めて導入されたマイクロフロントエンドアーキテクチャパターンを大幅に刷新したもので、ByteDanceのWeb Infraチームとオリジナル作者のZack Jacksonが共同で開発を進め、オープンソース公開から約1年を経てのリリースとなる。今回の安定版は大幅なアーキテクチャ刷新を経ており、「開発者生産性と極限のパフォーマンスの両立」を掲げている。
最大の変更点はランタイム層をビルドツールから分離したことだ。これにより実装が標準化され、webpack・Rspack・Rollup・Rolldown・Rsbuild・Vite・Metroといった多様なバンドラー、さらにNext.js・Modern.js・Storybookなどのフレームワークに対して統一的なModule Federationのサポートが実現した。
主要な新機能
動的TypeScript型ヒントの自動生成は開発者体験の面で最も大きなインパクトをもたらす機能とされている。従来はリモートモジュールを利用する際に静的な型情報が失われてしまい、共有型パッケージを別途用意するかany型で妥協するしかなかった。2.0では開発中にリモートモジュールから型定義が自動生成され、ホットリロードにも対応する。
共有依存関係のTree Shakingにより、バンドルサイズを最大75.5%削減できる。公式ブログでは、Ant Designから3コンポーネントだけ使用する場合に共有バンドルが1404.2 KBから344.0 KBへ大幅に縮小した例が示されている。動作モードは自動フォールバックが可能な「runtime-infer」とグローバル最適化を行う「server-calc」の2種類が用意されている。
Node.js・SSRファーストクラスサポートでは、リモートモジュールをサーバーサイドレンダリング・BFF（Backend for Frontend）・Nodeマイクロサービスで利用できるようになり、フルスタックアプリケーション全体で統一的なモジュール配信が可能となった。アイソモーフィックデータプリフェッチ機能はサーバー・クライアント双方に対応したデータ取得を提供し、ウォーターフォールロードを防ぐキャッシュ機構を内蔵する。
技術的な強化点
コア機能の一部はRustで再実装された。マニフェスト生成やAsyncStartUpなどが対象で、大幅なパフォーマンス向上が図られている。また、デプロイ統合のためのmf-manifest.jsonプロトコルが新たに導入された。
デバッグ・分析面ではSide Effect Scannerが追加され、グローバル変数汚染・イベントリスナー・CSSスコープへの影響を静的解析で特定できる。Chrome DevTools拡張機能もアップデートされ、共有依存関係の可視化と依存グラフのナビゲーション機能が強化された。
移行と今後の展望
既存のModule Federationプロジェクトからは@module-federation/enhanced npmパッケージを通じて段階的に移行できる。コミュニティからは型ヒントや開発ツールの改善に対する歓迎の声がある一方、pnpm catalogsとTurborepoを使ったモノレポアプローチと比較した複雑さへの懸念も引き続き存在する。今後のロードマップにはReact Server Componentsとの統合や、コンポーネント探索・評価のためのAIフレンドリーなメタデータ対応が含まれている。