微型前端：是什么，为什么，以及怎么搞？

10年积累的成都网站建设、网站设计经验，可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你，你也不认识我。但先网站制作后付款的网站建设流程，更有祁连免费网站建设让你可以放心的选择与我们合作。

在我之前的文章中(本文末尾的链接)，我展示了有关微前端的动手以及如何创建它们。在本文中，我将恢复退步并解释什么是微型前端，为什么我们需要使用它们和不同的方式来实现它们。这请帮助我为我公司提供建议的建议，我希望它能让读者有益于为您的项目提供合适的架构选择。

什么是微前端

Martin Fowler将微前端架构定义为“一种独立可交付前端应用程序被组成的建筑风格”。简单地，微前端是网页的一部分(不是整页)。在微前端架构中，有一个“主机”或“容器”页面，可以托管一个或多个微前端。主机/容器页面还可以共享一些自己的微前端组件。

例如，正如我们在先前的文章中实现的那样，我们将按钮组件从MFE1页面暴露到MFE2(主机/容器)中

或者在

http://mfe1.s3-website-us-east-a.amazonaws.com/在本文中部署到S3

微型前端架构由3个主要组件组成：

• 微前端(在上一个示例中，MFE1的按钮是微前端)
• 主机/容器(在前面的示例中，MFE2是主机)
• 微型框架：我们使用了WebPack 5模块联合插件

为什么微型前端?

引入了微前端架构以解决当前SPA前端开发的多个问题。我经历了单个网站的增长，以至于它变得非常难以扩大，修改甚至培训新工程师成为其中的一部分。通过这种单片系统，开发人员将彼此封锁，以应用一个小变化。以下是微型前端的一些好处：

• 团队可扩展性：多个团队可以独立工作以贡献多个系统。这使我们能够将工作划分并通过多个团队缩放。
• 单一责任：这将允许每个团队构建单一责任的组件。托管团队可以专注于分析，性能和每个功能团队可以专注于客户。两支球队可以在其特定领域获得100%。主页团队可以在创建大型主页上关注100%。每个微型前端团队将焦点100%的微观前端的功能。
• 可重用性：我们将能够在多个地方使用代码。将构建和部署一个组件，不同的团队可以重新使用它。
• 技术不可知论：微型前端架构独立于技术。您可以使用来自不同技术的组件(JavaScript，React，Vue，Angular …)。您不必担心部署或构建它们。
• 学习曲线：对于加入团队的新工程师，更容易学习较小的应用程序，而不是了解具有数千行代码线的巨石。

如何实施微型前端?

微前端的主要是主机/容器和微前端之间的集成。有三种方法可以整合微型前端

构建时集成

这是今天实施的大部分代码。容器将将组件安装为库，类似于您从NPM安装的库。此方法的问题正在同步图书馆的不同版本和构建问题。此外，很难使用不同的技术。此外，最终包的大小将很大，因为它包含所有依赖项。此外，您必须再次部署依赖性的任何更改。而且，容器和所有微前端之间存在紧密的耦合。

运行时集成

这是我在以前的文章中解释的。在这种情况下，容器是单独构建和部署的。每个微前端都可以作为单独的包装作为一个单独的包装，即容器/主机可以获取所需的微前端。有关此方法的更多解释，请参阅本文末尾的文章列表。在这种情况下，容器和微前端完全取耦合。它们不共享构建或部署，并可以使用不同的技术。容器可以决定要部署的微前端版本。

服务器端集成

在这种情况下，所有功能都将在确定要加载的微前端的后端中。服务器将决定将该请求路由到的URL。这是一个标准的服务器端构图。

新闻标题：微型前端：是什么，为什么，以及怎么搞？
分享网址：http://www.shufengxianlan.com/qtweb/news42/213492.html

成都网站建设公司_创新互联，为您提供ChatGPT、品牌网站制作、建站公司、网站排名、品牌网站建设、网站改版

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联