index.md

layout	home
hero	name text tagline image actions PubSub MFE Browser-native Pub/Sub for Microfrontends Zero dependencies, MQTT-style wildcards, production-ready src alt /logo.svg PubSub MFE theme text link brand Get Started /guide/getting-started theme text link alt View on GitHub https://github.com/belyas/pubsub-mfe
features	icon title details 🚀 Zero Dependencies No external libraries. Tree-shakable bundles with optimal size. Uses only native browser APIs. icon title details 🎯 MQTT-style Wildcards Flexible topic patterns with "+" (single-level) and "#" (multi-level) wildcards for powerful message routing. icon title details 🛡️ Handler Isolation Bulkhead pattern prevents cascading failures. One handler error doesn't affect others. icon title details 🔄 Cross-Tab Sync Multiple transports (BroadcastChannel, SharedWorker, Storage) for seamless cross-tab communication. icon title details 📜 History & Replay IndexedDB-based message history with TTL, retention policies, and efficient garbage collection. icon title details 🌐 Iframe Bridge Secure parent-child iframe communication with origin validation and bidirectional messaging. icon title details ✅ Schema Validation Optional JSON Schema validation with strict/warn modes for message contract enforcement. icon title details 📘 TypeScript-First Full type safety with branded types, comprehensive generics, and excellent IDE support. icon title details 🎛️ Lifecycle-Aware AbortSignal support for automatic cleanup and integration with modern React/Vue... patterns.

Quick Example

import { createPubSub } from '@belyas/pubsub-mfe';

// Create a bus instance
const bus = createPubSub({ app: 'my-app' });

// Subscribe with wildcards
bus.subscribe('cart.#', (msg) => {
  console.log('Cart event:', msg.topic, msg.payload);
});

// Publish messages
bus.publish('cart.item.add', { sku: 'ABC123', qty: 1 });
bus.publish('cart.checkout', { total: 99.99 });

Why PubSub MFE?

Built specifically for microfrontend architectures, PubSub MFE solves common communication challenges:

• Decoupled Communication: Teams work independently without tight coupling
• Event-Driven Architecture: Build reactive, scalable applications
• Cross-Tab Coordination: Keep multiple tabs/windows synchronized
• Historical Context: New components can catch up with past events
• Production-Ready: Battle-tested with comprehensive error handling

Architecture Overview

Architecture: Core bus with pluggable adapters

What's Next?

New to PubSub MFE?

Start with the Getting Started Guide to learn the basics.

Looking for specific features?

Check out the Core Concepts to understand the architecture.

Migrating from another solution?

See Best Practices for migration patterns.