azl397985856/fe-interview

【每日一题】- 2020-01-19 - 微前端如何做应用隔离

Closed this issue · 1 comments

如何解决微应用之间互相影响的问题,这种影响可能是css层面的,也可能是全局变量层面的。 总之一切全局的东西都有可能会冲突。 我们如何解决这样的问题?

扩展:

  • 对于多个应用之间,如果需要通信怎么办? 如果通信量特别大,我想让两者共享引用以减少这种数据传递怎么做?

关于CSS隔离

  • 我们可以使用CSS-module来处理,也可以采用约定的形式,虽然约定的形式总感觉不太靠谱。

  • 另一种方式是微应用注册的时候通过style标签引入,之后卸载的时候从DOM中移除即可。

关于JS隔离

我们可以给JS一个沙箱环境。 一个健全的沙箱环境可能非常复杂。但是我们可以简单实现它。我们可以通过Proxy或者Object.defineProperty 拦截对window的直接处理,进而实现所谓的沙箱环境。 阿里开源的qiankun正好也是基于这个**去做的,感兴趣的可以参考下 https://github.com/umijs/qiankun/blob/master/src/sandbox.ts#L38

关于扩展

关于通信,我们可以参考WebWorker和主线程的通信方式。 WebWorker对这种大数据数据传输有transferable-objects来处理。