应用缓存

• 如果我们之前加载过的页面，我们就不重新加载，直接应用缓存
• 我们在loader中进行缓存处理
• main/micro/loader/index.js ```javascript // 根据子应用的name做缓存 const cache = {}

export const parseHtml = async (entry, name) => { if (cache[name]) { return cache[name] } 。。。

allScript = script.concat(fetchedScripts) // 添加缓存 cache[name] = [dom, allScript] return [dom, allScript] }

<a name="kNzRi"></a>
# 预加载子应用
- 我们在加载当前子应用时，将其他子应用也加载，但是不显示，实现缓存
- main/micro/start.js
```javascript
export const start = () => {
  ...
  // 预加载 - 加载接下来所有的子应用，但是不显示
  prefetch()
}

• main/micro/loader/prefetch.js ```javascript import { parseHtml } from “./index” import { getList } from “../const/subApps”

export const prefetch = async () => { // 1. 获取所有子应用列表 - 不包括当前正在显示的 const list = getList().filter(item => !window.location.pathname.startsWith(item.activeRule)) // 2. 预加载剩下的所有子应用 await Promise.all(list.map(async item => await parseHtml(item.entry, item.name))) } ```

• 由于我们在parseHtml中做了缓存
• 所以，当我们访问下个子应用时，会直接走缓存内容，如果没有缓存，会重新解析，再缓存