微前端的概念不是特定明确的，广泛意义上讲，页面在运行时动态加载外部页面(In-Browser Module)的都算，这个页面可以时小到一个页面组件，一个大到包含一系列页面的组件。

所以说Single SPA时一种组织微前端的方式，他的方式是通过路由来决定挂载哪个外部页面

single-spa is a way of structuring your routes for microfrontends.

jsx
<template id="single-spa-layout">
    <single-spa-router>
      <nav class="topnav">
        <application name="@react-mf/navbar" loader="topNav" error="topNav"></application>
      </nav>
      <div class="main-content mt-16">
        <route path="people">
          <application name="@react-mf/people"></application>
        </route>
        <route path="planets">
          <application name="@react-mf/planets"></application>
        </route>
        <redirect from="/earth" to="/planets"></redirect>
        <route default>
          <h1 class="flex flex-row justify-center p-16">
            <p class="max-w-md">This example project shows independently built and deployed microfrontends that use React and single-spa. Each nav link above takes you to a different microfrontend.</p>
          </h1>
        </route>
      </div>
    </single-spa-router>
  </template>

而应用的具体加载则是通过SystemJS + import maps 来实现的。

In-Browser ModuleH2

实现方案包括

• cross microfrontend imports 将模块导出成ES Module，并通过浏览器/System JS来加载。
• module federation Module Federation is a performance technique for microfrontends.

ParcelH2

Parcel和Applicaiton都是独立于开发栈的。如果是同样的技术栈，Parcel完全可以被build-time modules 替换。