微前端架构

banq

微前端基本上是微服务模式的扩展，其中功能扩展到前端。因此，微前端带来了广泛的优势，包括部署独立性、更容易测试功能等。
微前端背后的想法是将 Web 应用程序视为由独立团队拥有的功能组合。每个团队都有自己关心和专攻的不同业务领域。团队是跨职能的，从数据库到用户界面，端到端地开发其功能。
 
微前端背后的核心概念：
  • 技术独立
每个团队都应该在不与其他团队协调的情况下选择和升级堆栈。自定义元素有助于隐藏实现细节，同时为其他人提供中立的界面。
  • 隔离团队代码
永远不要共享运行时，即使团队使用相同的框架。构建自包含的独立应用程序。不要依赖共享状态或全局变量。
  • 创建团队前缀
在尚无法隔离的地方使用命名约定。命名空间 CSS、本地存储、事件和 Cookie，以避免冲突并澄清所有权。
  • 优先使用本机浏览器功能而不是自定义 API
使用浏览器事件进行通信，而不是构建全局 PubSub 系统。如果需要构建跨团队的 API，请尽量保持简单。
  • 构建弹性网页设计
即使JavaScript无法执行，这些功能也应该很有用。要提高感知性能，请使用通用渲染和渐进增强。
 
好处：
  • 更好的可扩展性
  • 更快的开发，因为团队可以独立工作。
  • 您可以在应用程序中使用多个框架。但是，应该谨慎和透明地进行操作以避免混淆。
  • 部署独立性。您的微前端的交付不会影响整个应用程序。这些更改将准确地影响它所涵盖的业务流程的那部分。
  • 使用微前端，您可以比以前更顺利地升级、更新甚至重写前端的某些部分。
  • 确保应用程序的其余部分保持稳定更容易，因为它是独立的。使用微前端，您不再需要跟踪整个应用程序。
  • 代码库更小，更易于管理。
  • 更容易聘请专家。使用微前端，您可以寻找专业人员来处理使用特定技术堆栈的应用程序的特定部分，因此您不需要他们了解其他团队使用的技术。
  • 更容易测试，因为您只测试单独的功能。