微前端是一种测试方法，它为独立团队拥有的web应用提供多种功能或模块，使它们更加用户友好和更小的体积。他们基本上把前端应用分成独立的和半独立的微应用，这样每个应用都可以采用不同的技术，比如React、Angular或Vue，这样就可以很容易地集成到单个应用中。
为什么需要微前端假设你正在一个项目中使用一个特定的框架或库(比如React.js)，但你需要切换到另一个框架或库，或者添加另一个在另一个框架(比如Angular.js)上编写的模块。没有一个微前端，你将不得不重写整个项目或模块，这是一个乏味的过程。
另一种情况是，如果你正在处理一个包含多个团队的大型项目，那么协作将成为一项任务。当代码库很大时，组件和页面需要连接起来，因为有时您的工作与其他团队成员的工作重叠。这将导致进一步的重写，更复杂和时间管理不善，并导致整个开发过程的延迟。如果你不需要改变任何东西，你可以用你选择的另一个框架开始添加新模块呢?这就是微前端出现的地方。
它们帮助我们在多个框架(甚至是VanillaJS)中编写应用程序，并使用相同的路由（router）和域(domain)加载它们。我们可以开发包含认证和路由实现的主父应用程序，然后我们可以继续添加多个独立工作的子应用程序，可以在相同或不同的页面加载。
如何构建微前端现在让我们来看看如何构建一个真正的应用，以及如何使用微前端集成两个框架，React和Angular。这里出现的第一个问题是，我们应该如何划分应用，因为没有特定的标准来划分它们。根据我们的要求，我们可以用相当多的方式来做到这一点。让我们来看看下面的一些想法:
功能
这是最常用的划分，我们将在这里划分应用程序的特性或模块。例如，假设仪表板上有三个功能，我们也可以为每个各自的功能提供三个微前端，仪表板作为公共部分。
页面
在一些应用程序中，功能按页面划分。我们可以按页面来划分应用程序，使用这种方法时，每个页面都有独立的功能。
域
应用程序也可以按域划分。例如，我们可以根据我们的需求将应用程序划分为核心域、支付域或配置文件域。
在网页上实现子应用程序有两种方法:
每个页面上有一个应用程序
所有的子应用程序在一个页面上
准备由于每个微前端将被放置在特定的位置，并将有自己的API，我们需要有一个将在特定位置呈现应用程序的基础。以下是一些我们可以实现这一目标的方法:
Webpackmodulefederation
NGINX
iFrames
Web