การแชร์สถานะและยูทิลิตีระหว่างแอประยะไกล

Module Federation can share more than third-party libraries. You can expose your own stateful stores, utilities, and design tokens so all remotes use one consistent source.

Expose a shared utilities package from one app and consume it everywhere, eliminating copy-pasted helper code.

Expose colors, spacing, and typography as a shared module so every micro frontend stays visually consistent without bundling its own copy of the theme.

A shared store (e.g. a Redux or Zustand instance) lets remotes read and update common data. The key is sharing a single instance, not separate copies.

If two remotes each load their own store, their state diverges. Marking the store package singleton: true guarantees they share the same live instance.

Expose the already-created store, not a factory, so consumers attach to the same object.

Remotes import the shared store and subscribe to it like any local store, but updates from any remote are visible to all.

Shared mutable state increases coupling. Overuse recreates the tight dependencies micro frontends try to avoid. Share state only for truly cross-cutting concerns like auth or cart.

Where possible, prefer a shared event channel over a shared mutable store. Events keep remotes decoupled while still letting them react to each other.

Treat the shape of shared state and utilities as a public contract. Changing it is a breaking change, so version it and communicate updates to consuming teams.

A healthy strategy layers sharing:

• Libraries: share freely (React, etc.)
• Utilities and tokens: share for consistency
• Mutable state: share sparingly and deliberately

You learned advanced sharing:

• Share utilities and design tokens for consistency
• Share a singleton store for cross-cutting state
• Expose the instance, not a factory
• Prefer events to limit coupling
• Version shared contracts carefully

Thoughtful sharing balances consistency with independence.