先前我们介绍了 react-loadable 与 React.lazy，今天我们来看一款新的方案 @loadable/component 的实现，以及这三种主流方案的全面对比

个人的微前端体系实践后的心得总结，2022年中，开始了使用微前端框架对原有多个业务平台进行整合，历时2个月，渐进式的完成了所有项目平台的融合。

微前端是什么 微前端是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立运行、独立开发、独立部署。

最近因为两个后端系统要复用相同的功能模块，为了不直接复制代码，避免代码迁移的烦琐以及后期维护巨大的工作量，对两个系统进行了微前端的改造，也为后面vue2升级vue3，融合react框架做铺垫。技术选型

目前处于业务的起步阶段，FE团队主要负责B端的管理系统。随着时间的推移和更多相互独立功能的集成（涉及老应用集成），再加上人员和团队经常变动，系统变得越来越庞大和难以维护是不可避免的。同时就目前前端技术

qiankun 是主流的微前端方案，其他的还有京东的 micro-app、腾讯的 wujie 等。 微前端就是可以一个页面跑多个 vue、react 甚至 jquery 等不同项目，它之间的 JS、C

qiankun中实现了“元素隔离”的效果啦，完美解决了开启样式隔离后的样式丢失问题，妈妈再也不怕我同时加载多个子应用了～～～

本章完成了强盛集团管理系统接入、基座登录、基座与微应用通信、基座简单鉴权。 本项目已经实现了左侧栏的折叠和面包屑、个人中心、设置面板，强盛集团管理系统接入，下一章为《部署：微前端初步完成》。

Browser：这是一个浏览器实例，可以拥有浏览器上下文，可通过 puppeteer.launch 或 puppeteer.connect 创建一个 Browser 对象。 BrowserContext：该实例定义了一个浏览器上下文，可拥有多个页面，创建浏览器实例时默认会创建一…