{"id":28365991,"url":"https://github.com/jchip/fynmesh","last_synced_at":"2025-07-25T08:04:15.645Z","repository":{"id":292989082,"uuid":"982582562","full_name":"jchip/fynmesh","owner":"jchip","description":"Large Enterprise scale Web Application Framework with Module Federation \u0026 Micro Frontends","archived":false,"fork":false,"pushed_at":"2025-07-14T19:05:08.000Z","size":765,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-14T23:48:11.155Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jchip.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-13T05:35:55.000Z","updated_at":"2025-07-14T19:05:11.000Z","dependencies_parsed_at":"2025-05-27T10:34:05.071Z","dependency_job_id":"401a04c9-d367-4414-9c00-7f86f40c5092","html_url":"https://github.com/jchip/fynmesh","commit_stats":null,"previous_names":["jchip/fynmesh"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/jchip/fynmesh","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jchip%2Ffynmesh","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jchip%2Ffynmesh/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jchip%2Ffynmesh/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jchip%2Ffynmesh/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jchip","download_url":"https://codeload.github.com/jchip/fynmesh/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jchip%2Ffynmesh/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266977754,"owners_count":24015479,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-25T02:00:09.625Z","response_time":70,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-05-28T23:06:42.243Z","updated_at":"2025-07-25T08:04:15.604Z","avatar_url":"https://github.com/jchip.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# FynMesh - Large Enterprise scale Web Application Framework with Module Federation \u0026 Micro Frontends\n\nFynMesh is a large enterprise scale web application framework that provides advanced module federation and micro-frontend capabilities using Rollup to enable seamless sharing of code between independently deployed applications.\n\n## Overview\n\nFynMesh allows you to:\n\n- Build independent micro-frontends with their own deployment lifecycle\n- Share components and logic between applications using Module Federation\n- Efficiently handle shared dependencies to avoid duplicate loading\n- Integrate applications seamlessly at runtime\n- Load multiple versions of the same module simultaneously\n\n## Core Architecture\n\n### 1. Kernel\n\nThe kernel is the central component of FynMesh, located in the `core/kernel` directory. It's responsible for:\n\n- Loading and initializing fynapps (micro-frontends)\n- Managing shared dependencies\n- Providing runtime configuration\n- Handling cross-fynapp communication\n\nThe kernel implementation is minimal but functional, focusing on the essential capabilities needed to load and manage fynapps.\n\n### 2. FynApps\n\nFynApps are self-contained micro-frontends that can be developed and deployed independently. Each fynapp:\n\n- Has its own build and deployment lifecycle\n- Can expose components and modules for other fynapps to consume\n- Can share dependencies with other fynapps\n- Follows a specific structure with manifest files and module federation entry points\n\n## Key Features \u0026 Capabilities\n\nFynMesh provides powerful module federation capabilities that are valuable both for micro-frontend architectures and single applications. The framework can handle multiple versions of the same federated module running simultaneously through containers that implement the same federated module name but with different underlying implementations.\n\n**Core Features:**\n- **Runtime Module Sharing**: Load modules from other applications at runtime\n- **Shared Dependency Management**: Smart loading of shared dependencies with version matching\n- **Framework Agnostic**: Support for React, Vue, Marko, Preact, Solid, and more\n- **Development Tooling**: CLI tools for creating and managing fynapps\n\n**Advanced Capabilities:**\n- **Multi-Version Support**: Load multiple versions of the same module simultaneously\n- **Dynamic Code Loading**: Load application modules on-demand to reduce initial bundle size\n- **Plugin Architecture**: Build extensible applications where features can be loaded dynamically\n- **Library Sharing**: Share common libraries and components across different parts of a large application\n- **Code Splitting**: Advanced code splitting strategies beyond what traditional bundlers offer\n- **Runtime Flexibility**: Modify application behavior without rebuilding the entire application\n- **Gradual Migration**: Deploy new versions alongside existing ones\n- **A/B Testing**: Run different versions for different user groups\n- **Backwards Compatibility**: Maintain support for legacy versions\n- **Isolated Dependencies**: Apps can use different versions of the same library\n- **Version Resolution**: Automatic handling of version compatibility\n\n**Micro-Frontend Capabilities:**\n- **Flexible Architecture**: Support for various micro-frontend patterns\n- **Independent Deployment**: Each fynapp has its own build and deployment lifecycle\n- **Cross-App Integration**: Seamless integration of independently developed applications\n\n**Multi Versions Demo Examples:**\n\nIn demo, there's a fynapp `fynapp-react-lib` with two versions implemented in different directories:\n- `demo/fynapp-react-18/` - Provides React 18 library as a federated module\n- `demo/fynapp-react-19/` - Provides React 19 library as a federated module\n\nIn demo, there's a fynapp `fynapp-x1` with two versions implemented in different directories, to provide some common React components for other fynapps to build with:\n- `demo/fynapp-x1/` - Version 1 of shared component library\n- `demo/fynapp-x1-v2/` - Version 2 of shared component library\n\nThese capabilities enable:\n- Independent deployment cycles for different teams\n- Incremental adoption of new library versions\n- Complex enterprise scenarios with mixed technology stacks\n- Zero-downtime migrations and rollbacks\n\n## Project Structure\n\nThis is a colorepo managed with [fynpo](https://jchip.github.io/fynpo/) where each package can be developed and deployed independently, while being automatically interconnected locally:\n\n- `core/kernel/` - Main kernel implementation for loading and managing fynapps\n- `rollup-federation/` - Core module federation based on SystemJS co-located at \u003chttps://github.com/jchip/rollup-federation\u003e\n- `demo/` - Example applications demonstrating the framework in action with various frontend frameworks\n- `dev-tools/` - Development tools including create-fynapp for scaffolding new fynapps\n- `misc/` - Miscellaneous utilities and examples\n\n**Colorepo Benefits:**\n- Shared dependencies are managed efficiently by fyn\n- Packages can import from each other easily within the colorepo\n- The kernel provides runtime integration between independently deployed fynapps\n\n## Getting Started\n\n1. Clone the repository\n   ```\n   git clone https://github.com/jchip/fynmesh.git\n   ```\n   or\n   ```\n   git clone git@github.com:jchip/fynmesh.git\n   ```\n2. Install fyn if you don't have it already:\n   ```\n   npm install -g fyn\n   ```\n3. Install dependencies using fyn:\n   ```\n   fyn bootstrap\n   ```\n   for production build:\n   ```\n   NODE_ENV=production fyn bootstrap\n   ```\n4. Run the demo applications:\n   ```\n   fyn start\n   ```\n\n## Development Workflow\n\nThe typical workflow for developing with FynMesh includes:\n\n1. Create a new fynapp using the `create-fynapp` tool\n2. Develop the fynapp independently\n3. Build and deploy the fynapp\n4. Register the fynapp with the kernel\n5. The kernel loads and manages the fynapp at runtime\n\n## Key Technologies\n\n- **Module Federation**: Used for sharing code between independently deployed applications\n- **Rollup**: Build tool used for bundling fynapps\n- **TypeScript**: The primary language used throughout the codebase\n- **Various Frontend Frameworks**: Support for React, Vue, Marko, Preact, and Solid\n\n## Documentation\n\nFor more detailed documentation on how to use FynMesh, please check the documentation within each module.\n\n## License\n\n[Apache 2.0](LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjchip%2Ffynmesh","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjchip%2Ffynmesh","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjchip%2Ffynmesh/lists"}