浅谈微前端之qiankun、icestark

什么是微前端？

微前端指的是一种前端架构模式，主要是帮助开发者构建复杂的前端应用，将大型的单体前端应用拆分成更小、更易于管理的独立子应用。每个子应用都可以由不同的团队独立开发、测试和部署等，并且它们可以独立运行或在一个容器应用中组合展示。

微前端的核心理念是将前端应用拆分成多个小的子应用，然后通过一种集成机制将它们组合成一个整体。这种模式类似于微服务架构在后端的应用，因此被称为微前端。

主要的优势和特点包括：

1. 独立开发和部署：不同的子应用可以由不同的团队独立开发，每个子应用都有自己的代码库和构建部署流程，这有助于提高团队的协作效率。

2. 技术栈灵活：不同的子应用可以使用不同的前端框架或技术栈，无需统一整个应用的技术选型。

3. 隔离型和稳定性：每个子应用运行在独立的沙箱环境中，互不干扰，因此一个子应用的问题不会影响其他子应用的运行。

4. 增量升级：微前端允许您对单个子应用进行升级，而无需整体升级整个应用，降低了升级的风险。

5. 性能优化：通过动态加载和按需加载，微前端可以优化页面加载时间，仅在需要时加载子应用的代码。

微前端可以通过多种技术实现，常见的技术方案包括Single-SPA、qiankun、icestark等。它适用于大型复杂的前端应用，特别是在不同团队部门合作开发的场景下，能够有效地解决前端应用的拆分和协作问题。

qiankun是什么？

qiankun是一个开源的微前端框架，由蚂蚁金服前端团队开发和维护。它的旨意是帮助开发者构建复杂的前端应用，将多个独立的子应用整合到一个整体，并实现它们之间的动态交互。qiankun的目标是通过微前端的思想来解决大型前端应用所面临的复杂性和维护性问题。

qiankun原理主要涉及以下几个方面：

1. 主应用和子应用：

• 主应用是整个微前端应用的宿主，它主要负责加载和管理所有的子应用。
• 子应用是独立的前端应用，他们可以单独开发、测试和部署。子应用通常由不同的团队维护，可以是Vue、React、Angular等任意的前端框架构建。

2. 独立构建和部署：

• 每个子应用都是独立的前端项目，可以通过单独的构建和部署流程来生成独立的静态资源（通常是HTML、CSS、JS文件）
• 主应用在运行时动态加载子应用的静态资源，使得子应用可以独立运行，也可以作为一个整体被加载到主应用中展示。

3. 路由管理：

• qiankun使用了前端路由来实现子应用的展示和隐藏。主应用负责整体路由的管理，当用户访问不同的子应用页面时，主应用会根据路由信息加载相应的子应用。
• 子应用在注册时需要提供自己的路由信息，并能够根据主应用传递的路由参数进行相应的展示。

4. 沙箱隔离：

• 为了避免子应用之间的冲突和影响，qiankun采用了沙箱隔离机制。每个子应用在加载时都会被放置在一个虚拟的沙箱环境中，隔离了各个子应用之间的全局变量和依赖关系。

5. 状态管理：

• 内置了一套状态管理机制，子应用可以通过qiankun提供的应用间通信API来实现状态在主子应用之间的共享，便于子应用之间进行数据交互

总的来说，qiankun的原理是通过将多个独立的前端应用整合到一个整体中，通过沙箱隔离和动态加载等机制来实现它们在同一个页面上共存，并且能够实现动态交互。

什么是icestark？

icestark是一个由阿里巴巴集团推出的微前端解决方案，旨意是在帮助开发者构建复杂的前端应用，实现多个独立的子应用整合为一个整体，并支持子应用之间的动态交互。它是基于Single-SPA（一个开源的微前端框架）扩展而来，借助Single-SPA的能力，icestark可以兼容不同前端框架，如React、Vue、Angular等。

qiankun与icestark的区别：

1. 技术栈和设计理念：

• icestark是在Single-SPA的基础上构建而成，继承了Single-SPA的设计理念，强调子应用的独立性和灵活性。可以兼容不同的前端框架，子应用之间更加解耦。
• qiankun是一个独立的微前端框架，有着自己独特的设计理念和技术栈。它在一定程度上限制了子应用的开发和集成，但也提供了一系列完整的解决方案，使得开发者可以更快地搭建微前端应用。

2. 状态管理：

• icestark和qiankun在状态管理方面有一些不同。icestark没有强制使用特定的状态管理方案，开发者可以根据需要选择自己喜欢的状态管理库。
• qiankun内置了一套状态管理机制，使用qiankun提供的应用间通信API可以实现状态的主应用之间的共享。

3. 依赖解决方案：

• icestark的设计目标之一是减少主应用和子应用之间的依赖，使得子应用可以更加独立的开发和部署。
• qiankun为了提供更完整的微前端解决方案，引入了依赖于加载和依赖共享的机制，这使得子应用之间的依赖关系更为复杂。

选择使用哪种技术方案来实现微前端，主要还是根据业务来选择，以上是个人见解。