Adakah Micro Frontend "Reka Bentuk Berlebihan" atau "Keperluan"?
Micro Frontend (MFE) telah menerima pujian dan kritikan yang melampau sejak kemunculannya dalam ThoughtWorks Technology Radar pada 2018. Semasa zaman kegemilangan "monorepo + Turborepo" pada 2022–2023, ia kehilangan perhatian, tetapi sejak 2025, ia mendapat sorotan semula dengan tiga angin sokongan: kestabilan Module Federation 2.0, penggunaan praktikal Rspack dalam produksi, dan peluasan jurang produktiviti pasukan akibat ejen AI. Artikel ini mengulas tindanan teknologi MFE pada April 2026 dan memperkenalkan tiga kes peralihan berperingkat di syarikat kewangan besar, SaaS, dan e-dagang Jepun.
Module Federation 2.0: Penyempurnaan Generasi Kedua
Module Federation ialah mekanisme yang diperkenalkan dalam Webpack 5 pada 2020 untuk memuatkan modul secara dinamik dari jauh pada masa jalan. Dalam versi 2.0, API baharu yang menyokong kedua-dua Webpack/Rspack telah disediakan dengan sumbangan daripada pasukan Rspack (ByteDance). Terdapat tiga penambahbaikan. Pertama, sistem pemalam runtime membolehkan "senarai jauh" dan "versi pergantungan bersama" ditulis semula secara dinamik pada masa jalan, membolehkan ujian A/B dan penghantaran mengikut atribut pengguna tanpa muat semula. Kedua, keselamatan jenis — 2.0 menyertakan `.d.ts` dalam bekas jauh, membolehkan pelengkapan IDE. Ketiga, sambungan Chrome DevTools "Module Federation Inspector" membolehkan visualisasi status pemuatan secara masa nyata.
Rspack / Vite / Webpack: Garisan Hadapan Alat Bina
Webpack 5 berada dalam kedudukan warisan tetapi masih menjadi pilihan pertama projek berskala besar sedia ada kerana ketebalan ekosistemnya. Rspack 1.x ialah pembina serasi Webpack berasaskan Rust yang 5–10 kali lebih pantas, menyokong Module Federation 2.0 secara rasmi dan menjadi standard sejak 2025. Vite 6 menyokong melalui pemalam `@module-federation/vite`, tetapi keserasian HMR dan penyelesaian masa jalan adalah kurang baik, jadi lebih selamat untuk menggunakan status eksperimen semasa pembangunan. Turbopack belum melaksanakan sokongan rasmi Module Federation sehingga April 2026, dan jika menggunakan Module Federation, berundur ke Webpack/Rspack adalah lebih praktikal.
Single-SPA dan iframe: Satu Lagi Laluan
Single-SPA ialah kaedah di mana shell aplikasi menguruskan kitaran hayat berbilang SPA, dan masih menjadi pilihan terbaik untuk organisasi yang memerlukan campuran rangka kerja heterogen (React + Vue + Angular). Overhed permulaan dikurangkan 40% dengan keluaran 7.0 pada 2025. Gabungan paling seimbang dalam amalan ialah hibrid Module Federation + Single-SPA, di mana Single-SPA mengendalikan kawalan pemasangan dan Module Federation mengendalikan perkongsian pergantungan. Konfigurasi ini diterima pakai oleh Zalando, IKEA, dan contoh Jepun yang disebutkan kemudian.
Penghantaran Tepi dan Pemusnahan Cache
Cabaran operasi terbesar MFE ialah "konsistensi versi jauh". Amalan terbaik 2026 ialah Immutable Assets + Manifest Indirection. Nama fail berasaskan hash kandungan diberikan kepada segmen JS jauh dan disimpan dalam jangka panjang dengan `max-age=31536000, immutable`, manakala hanya entri `mf-manifest.json` dihantar dengan cache jangka pendek (max-age=60, stale-while-revalidate=300). Manifes berfungsi sebagai indirection untuk penukaran versi, dan apabila entri dikemas kini, semua hos akan mendapatkan versi baharu selepas TTL tamat.
Pengurusan terpusat manifes dalam edge KV telah menjadi mantap sama ada menggunakan Cloudflare, Fastly, atau CloudFront. Untuk canary, medan `traffic_split` ditambahkan ke manifes dan penilaian nisbah dibuat menggunakan pemalam runtime Module Federation 2.0.
Kes 1: Pemisahan "Hadapan Sistem Akaun" Bank Mega
Satu bank besar memisahkan aplikasi React monolitik (kira-kira 2.4 juta LoC) perbankan internet kepada 7 MFE mengikut pasukan. Pencetusnya ialah masalah pembengkakan klasik: "perubahan satu pasukan menghentikan keluaran 6 pasukan lain", "npm install 8 minit", dan "bina 22 minit".
Konfigurasi yang diterima pakai ialah Webpack + Module Federation 2.0 + Single-SPA. Hos ialah shell nipis yang hanya mempunyai ringkasan akaun, navigasi, dan pengesahan, yang memuatkan 7 MFE secara dinamik: "pemindahan", "amanah pelaburan", "pinjaman", "kad", "pelaporan cukai", "insurans", dan "pertanyaan".
Peralihan berperingkat dirancang selama 18 bulan, bermula dengan memisahkan shell terlebih dahulu dan membungkus monolith sedia ada sebagai satu MFE menggunakan "Strangler Facade". Kemudian MFE dipisahkan dari monolith sedia ada mengikut unit fungsi. Setiap pasukan dapat meningkatkan versi React secara bebas, dan pada akhir peralihan, versi React setiap MFE tersebar dari 18 hingga 19.2.
Hasilnya jelas. Masa bina purata setiap pasukan ialah 3 minit (pengurangan 86% dari 22 minit), kekerapan deployment dari sekali seminggu kepada purata 12 kali sehari, dan skop impak insiden berubah dari "penghentian semua fungsi" kepada "hanya MFE berkenaan". Dalam respons audit peraturan kewangan, rekod deployment bebas setiap MFE menjadi faedah tambahan.
Kes 2: Kewujudan Bersama Rspack + Vite Syarikat SaaS
Satu syarikat SaaS HR Tech mengendalikan portal pentadbir (Rspack) dan perkhidmatan layan diri untuk pekerja (Vite) dengan alat bina yang berbeza. Alat bina dipisahkan kerana perbezaan keperluan: portal pentadbir adalah besar dan memerlukan keserasian IE11 (keperluan pelanggan warisan), manakala portal pekerja berpusat pada mudah alih dan mengutamakan DX.
Perhubungan MFE ialah 4 fungsi: bar navigasi bersama, pusat pemberitahuan, carian, dan sembang bantuan. Ini masing-masing dibina dengan Rspack dari repositori bebas, dan kedua-dua portal memuatkannya melalui Module Federation 2.0. Sisi Vite disatukan sebagai pengguna sisi jauh dengan pemalam `@module-federation/vite`.
Pelajaran yang dipetik ialah "hadkan pergantungan bersama kepada minimum". Pada mulanya, banyak seperti React, dayjs, Zustand dan lain-lain ditetapkan sebagai shared, tetapi tiga insiden produksi berlaku akibat konflik singleton, dan akhirnya hanya tiga — React, React-DOM, dan konteks i18n — yang dikekalkan. Saiz bundle meningkat tetapi kestabilan operasi meningkat dengan ketara.
Kes 3: Peralihan Penghantaran Tepi Platform e-Dagang
SaaS pembina kedai e-dagang besar mempunyai afiniti tinggi dengan MFE kerana sifatnya menyediakan hadapan tersuai mengikut penyewa. Pada 2025, ia berpindah ke Rspack + Module Federation 2.0, dengan konfigurasi di mana Cloudflare Workers menjana manifes MFE secara dinamik dari ID penyewa. "Keluaran berperingkat ciri baharu hanya kepada pelanggan tertentu" dan "penghantaran reka bentuk terhad musim perayaan mengikut penyewa" kini boleh dilakukan tanpa deployment jurutera. Perangkapnya ialah SEO, yang diselesaikan dengan penyelesaian manifes pra-peralihan dalam SSR dan penyematan data berstruktur statik. Kadar indeks yang berkesan meningkat dari 92% kepada 98%.
Haruskah MFE Diterima Pakai: Senarai Semak Keputusan
Keputusan penerimaan harus dinilai berdasarkan sudut pandangan berikut. Jika 3 atau lebih item berkenaan, MFE harus dipertimbangkan dengan serius: bilangan pasukan 5 atau lebih dengan kitaran keluaran bebas / masa bina monorepo melebihi 10 minit / kewujudan bersama rangka kerja atau versi berbeza / penghantaran tersuai mengikut penyewa / ingin mengehadkan impak kegagalan kepada unit fungsi / jejak audit bebas diperlukan bagi setiap fungsi. Sebaliknya, jika pasukan 1–2, bina dalam 3 minit, dan kesederhanaan pemuatan pertama diutamakan, MFE adalah berlebihan.
Kesimpulan: Era "Penemuan Semula" MFE
Didorong oleh kematangan Module Federation 2.0, Rspack, evolusi penghantaran tepi, dan sokongan autonomi pasukan oleh ejen AI, MFE 2026 telah dinaik taraf dari "teknologi untuk organisasi perintis tertentu" kepada "kaedah baku untuk organisasi yang memenuhi syarat". Yang penting bukan memperkenalkan MFE sebagai "penyelesaian universal", tetapi memperkenalkannya sebagai preskripsi konkrit untuk kesakitan organisasi dan keperluan perniagaan. Seperti yang ditunjukkan oleh tiga kes dalam artikel ini, MFE dalam keadaan yang sesuai membawa penambahbaikan berlipat ganda dalam masa bina, kekerapan keluaran, skop impak kegagalan, dan kebebasan penyesuaian. Sebelum menolak "MFE? Usang" dalam mesyuarat seni bina seterusnya, ada baiknya menilai semula keadaan semasa organisasi anda.