在前面三篇文章中，我们主要介绍了micro-app提供的基本功能以及与iframe做了简单的对比，接下来我们则主要总结一下二者的区别。
| 功能 | micro-app | iframe |
|---|---|---|
| 生命周期 | 1、提供了完整的生命周期函数，created、beforemount、mounted、unmount、error 2、子应用被卸载时，可以接收到 unmount 事件 | 1、原生提供了 onload 事件 2、子应用并无法之间感知到被卸载 |
| 环境变量 | 提供了用于判断是否在微前端环境以及基座为子应用设置的属性 | 原生只提供了 location.ancestorOrigins 属性用于判断是否被内嵌 |
| JS 沙箱 | 基座中的全局变量可以被子应用读取，子应用中的全局变量无法被基座读取 | 非同源：基座中的全局变量无法被子应用读取，子应用中的全局变量也无法被基座读取 |
| 样式隔离 | 子应用的样式不会影响基座及其他子应用，但基座可以影响子应用样式 | 子应用无法影响基座及其他子应用样式同时基座也无法影响子应用样式 |
| 元素隔离 | 子应用无法获取基座元素，但基座可以获取子应用的元素 | 非同源：子应用无法获取基座元素同时基座也无法获取子应用的元素 |
| 数据通信 | 父子之间可以相互通信，同时也支持跨应用之间通信 | 非同源：只支持父向子的单向通信 |
| 预加载 | 支持 | 不支持 |
| 多层嵌套 | 支持 | 支持 |
| keep-alive | 支持 | 支持 |
通过以上对比，总体而言，micro-app封装好了许多功能，而iframe在非同源场景下拥有较多的限制，并且微前端场景下基本都是非同源。
