微框是类似于微服务的架构。它将微服务的概念应用于浏览器端。Web应用程序将从单个应用程序转换为多个小型前端应用程序。2016年的技术雷达中提到了Essencemicro-Frontends术语。
微型前端架构具有以下特征：
微型前端体系结构旨在在相对较长的时间范围内求解单个应用程序。由于参与人员和团队的增加和变化，在对Weblock Applicationunsoable问题进行了普通申请之后。例如：
通过微观前端分为容器应用程序和多个子应用程序后，每个应用程序都可以独立部署并彼此隔离，以便这样做：
通过NGINX配置反向代理，将不同的路径映射到不同的应用程序，例如www.abc.com/app1相应的APP1，www.abc.com/app2通讯APP2。该方案本身不属于前端级别的转换，Moreit是操作和维护的配置
优势：
缺点：
父亲的申请单独是页面。每个子应用都嵌套了一个iframe。
优势：
缺点：
每个子应用都需要使用纯Web组件技术来编写组件，这是一组新的开发模型
优势：
缺点：
使用模块联合会，我们可以在一个应用程序中动态加载和执行另一个应用程序代码，并且与技术堆栈无关，并且可以共享模块
优势：
缺点：
每个子申请都是独立建立和部署的。当运行时，父母将应用于Rout管理，应用程序加载，启动，卸载和通信机制
优势：
缺点：
组合应用路由分布是行业中常用的计划，可以满足大多数需求。让我们详细了解此实现方法
该解决方案使用基本模式，并通过主应用程序（基本应用程序 - main App）管理其他应用程序（子申请 - 微应用）。大多数基本应用程序都是前端SPA项目，主要负责申请注册，路由映射，消息等，微型应用是一个独立的前端项目。这些项目不仅限于使用React，Vue，Angular或Jquery。每个微型申请应将基础申请表和底座管理，但是如果您离开基地，也可以单独访问它
在运行整个Micro前端框架之后，给出的用户经验类似于以下图：
在简短的描述下，基本应用程序中有一些菜单项。单击每个菜单项以显示相应的微型应用程序。这些应用程序的切换是纯前端。
上述实施过程主要如下：
当应该在同一屏幕上渲染主应用程序和微型应用程序时，可能会彼此污染一些样式。可以采用以下两个解决方案。
微型应用和微应用之间的CSS隔离非常简单。每次加载应用程序时，标记了应用程序的链接和样式内容。卸载了应用程序后，可以在页面上卸载页面上的相应链接和样式
每当加载并运行Micro -Applied JavaScript时，其核心实际上就是窗口的修改，一个全局对象和某些全局事件的变化。例如，在JS运行JS运行后，一个窗口。$对象将安装在窗口上。对于其他库，VUE也不例外。为此，有必要在加载和卸载每个微型应用程序时尽可能消除这种冲突和影响。
沙盒机制的核心是允许本地JavaScript运行，并且外部对象的访问和修改位于可控范围内，即，无论内部操作如何，它都不会影响外部对象。VM模块是通常在node.js侧使用，对于浏览器，您需要与关键字和窗口结合。proxy对象
Microc前端不限制应用程序使用的框架。如何在不同的应用程序和框架之间进行交流是需要仔细考虑的决定。有许多方式交流性交。当然，要允许多个单独的微型应用进行交流，它与中间媒体或全局对象基本上是不可分割的。
通过事件进行交流应该是最简单，通用的解决方案
消息订阅（PUB/SUB）模式的通信机制非常适用。在基本应用程序中，将定义事件中心事件。每个微型应用程序分别注册。它构成了基本的通信机制
通过活动通过网络工作者进行沟通
主应用程序创建了带有子应用程序的State Store，适用于主和子应用技术堆栈的同一场景。
Microc前端是一种将单个巨型应用程序转换为多个微型应用程序的应用程序，可以解决“ Boulder应用程序”的维护问题。每个方案都需要考虑应用程序隔离和应用程序通信的问题。目前，它在组合路由分布方法中更常用。
原始：https：//juejin.cn/post/710425365725157786