qiankun解决的问题

1. qiankun 中的沙箱机制是如何实现的？解决了什么问题？

---

一、实现方式

qiankun 的沙箱机制主要用于隔离微应用之间的运行环境，避免相互影响。其核心实现基于两种策略：

1. 快照沙箱（SnapshotSandbox）

适用于不支持 Proxy 的低版本浏览器。

每次微应用切换时，记录 window 的状态（如全局变量），卸载时恢复原状态。

缺点：性能差、不支持多实例并发。

2. Proxy 沙箱（ProxySandbox）

主要依赖于 Proxy 实现沙箱。

为每个微应用创建一个 Proxy(window) 的代理对象，拦截所有对 window 的修改，限制作用域。

示例：

const sandbox = new Proxy(window, {
set(target, prop, value) {
// 只修改沙箱中的对象，不影响全局
sandboxState[prop] = value;
return true;
},
get(target, prop) {
return sandboxState.hasOwnProperty(prop) ? sandboxState[prop] : target[prop];
}
});

优点：性能好，支持多个微应用并发运行。

3. 样式隔离机制

除了 JS 沙箱外，还支持样式隔离：

Scoped CSS：通过添加前缀/标记隔离样式。

Shadow DOM：更彻底的样式隔离（实验性）。

---

二、解决的问题

1. 全局变量污染

每个微应用都可能操作 window，如 window.appName = ‘a’，会造成冲突。

沙箱确保这些变量只在自己的作用域内生效。

2. 样式冲突

不同微应用中的 CSS 可能互相覆盖。

样式隔离防止样式干扰。

3. 多实例并发运行

Proxy 沙箱允许多个微应用同时存在于页面中，互不影响。

4. 应用卸载时状态回滚

退出微应用时能恢复主应用或其它子应用原本的状态。

---

三、总结一句话

qiankun 通过 Proxy 等技术实现沙箱机制，有效隔离微应用之间的 JS 和 CSS 环境，解决全局变量冲突、样式污染、多实例运行等问题，是微前端稳定运行的核心保障。