https://github.com/lazyperson/anyjs

微前端开发框架
https://github.com/lazyperson/anyjs

framework micro

Last synced: about 1 month ago
JSON representation

微前端开发框架

• Host: GitHub
• URL: https://github.com/lazyperson/anyjs
• Owner: lazyperson
• License: mit
• Created: 2022-03-27T06:55:59.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2022-04-17T12:03:17.000Z (over 2 years ago)
• Last Synced: 2023-03-10T07:11:28.625Z (almost 2 years ago)
• Topics: framework, micro
• Language: JavaScript
• Homepage:
• Size: 21.5 KB
• Stars: 59
• Watchers: 2
• Forks: 5
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# anyjs

**anyjs** 是一个微前端实现框架，帮助大家能更简单、无痛的构建一个生产可用的微前端架构系统。

微前端架构的核心价值：

- 技术栈无关

  - 主框架不限制接入应用的技术栈，子应用具备完全自主权

- 独立开发部署

  - 子应用仓库独立，前后端开发独立，部署独立

- 增量升级

  - 在面对各种复杂场景时，我们通常很难对一个已经存在的系统做全量的技术栈升级或重构，而微前端是一种非常好的实施渐进式重构的手段和策略

- 独立运行时

   - 每个子应用之间状态隔离，运行时状态不共享

#### 为什么不用iframe?

如果不考虑体验问题，iframe 几乎是最完美的微前端解决方案了。

iframe 最大的特性就是提供了浏览器原生的硬隔离方案，不论是样式隔离、js 隔离这类问题统统都能被完美解决。但它的最大问题也在于隔离性无法被突破，导致应用间上下文无法被共享，随之带来的开发体验、产品体验的问题。

iframe存在的问题

- URL不同步。浏览器刷新 iframe url 状态丢失、后退前进按钮无法使用。

- UI不同步，DOM 结构不共享。想象一下屏幕右下角 1/4 的 iframe 里来一个带遮罩层的弹框，同时我们要求这个弹框要浏览器居中显示，还要浏览器 resize 时自动居中...

- 全局上下文完全隔离，内存变量不共享。iframe 内外系统的通信、数据同步等需求，主应用的 cookie 要透传到根域名都不同的子应用中实现免登效果。

- 慢。每次子应用进入都是一次浏览器上下文重建、资源重新加载的过程。