Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(option): loadMicroApp 增加 disableCache 配置项 #2329

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

kingback
Copy link

Checklist
  • npm test passes
  • tests are included
  • documentation is changed or added
  • commit message follows commit guidelines
Description of change

默认情况下,为了提升性能和避免内存泄漏的风险(见 #832),在多次加载相同微应用的时候,qiankun 不会重复加载资源和执行代码(见 #518),但这样会带来一些副作用:

  1. bootstrap 钩子会被跳过,直接 remount,一些写在 bootstrap 方法里的逻辑无法被执行,见 手动加载应用, 二次加载时,未发起请求? #1273
  2. 一些全局数据会被缓存,比如全局变量、全局 store 等,见 [改进]缓存的副作用 #2267

虽然这些问题可以通过一些方式解决,比如将 bootstrap 的逻辑放到 mount 里,比如在 unmount 的时候重置全局变量、store,但是:

  1. 这样改变了用户对 bootstrap 钩子的理解心智
  2. 一些无法修改的代码(比如第三方依赖的代码)无法进行处理

此处增加了 disableCache 的配置项,让用户可以选择关闭缓存,解决上述问题,同时在文档中也注明了可能带来性能和内存问题的风险

import { loadMicroApp } from 'qiankun';

loadMicroApp(app, {
  disableCache: true, // 禁用缓存
});

@vercel
Copy link

vercel bot commented Nov 11, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
qiankun ✅ Ready (Inspect) Visit Preview Nov 11, 2022 at 9:43AM (UTC)

@kuitos
Copy link
Member

kuitos commented Dec 27, 2022

这个应该有一个单独的 unload 方法来做卸载比较好,不过 2.x 不计划再新增 api 了

@kingback
Copy link
Author

这个应该有一个单独的 unload 方法来做卸载比较好,不过 2.x 不计划再新增 api 了

unloadMicroApp 的作用包含哪些呢?卸载微应用且删除资源缓存?可能容易跟 unmount 混淆吧?
disableCache 类似 chrome devtool 里的停用缓存,功能比较聚焦一些,并且可以针对特定微应用开启

@kuitos
Copy link
Member

kuitos commented Dec 27, 2022

不会混吧,single-spa也有类似的api。

这个需求本质是卸载一个应用,确保他的缓存等信息是清空的,加载一个不带cache的微应用背后实际就是先清空缓存再加载

@kingback
Copy link
Author

不会混吧,single-spa也有类似的api。

这个需求本质是卸载一个应用,确保他的缓存等信息是清空的,加载一个不带cache的微应用背后实际就是先清空缓存再加载

这个也有道理,但如果页面中存在多个相同微应用实例,此时并不会进行卸载,那就依然存在缓存问题

或者说 disableCache 的配置和 unloadMicroApp API 并不冲突?两者支持的场景有不同的地方

@kuitos
Copy link
Member

kuitos commented Dec 28, 2022

回到原始问题:

  1. bootstrap 本身就是设计用来做缓存的,避免应用 remount 时做一些重复动作,如果预期是副作用就是要重复执行,那就是应该放到 mount 里而不是 bootstrap。
  2. 如果有些三方依赖的副作用没法放到 mount 里,那就只能先 unload 再 load 了。

如果是为了解决有些全局副作用不会重复执行的问题,我的思路还是先 unload 再 load,明确这是一个全新的应用加载流程,而不是说我是加载同一个微应用,只是这次不用 cache 的语义。

@SCLGIS
Copy link

SCLGIS commented Jan 19, 2023

不会混吧,single-spa也有类似的api。

这个需求本质是卸载一个应用,确保他的缓存等信息是清空的,加载一个不带cache的微应用背后实际就是先清空缓存再加载

@kuitos 具体怎么清空他的缓存呢,可以先上一部分代码么,我这边也是微应用切换的时候,内存一直在增加。

@SCLGIS
Copy link

SCLGIS commented Jan 19, 2023

@kuitos 那目前内存增加的问题,有临时解决方案么,可以提供下思路和代码么

@SCLGIS
Copy link

SCLGIS commented Jan 20, 2023

@kingback 你这边问题解决了么

@jisao
Copy link

jisao commented Jun 25, 2023

同样, 我也遇到此问题, 由于load了多份子应用, 导致内存居高不下, chrome内存直接干到1个G了

@yuanbaba
Copy link

@kuitos 请问下缓存的问题有解决方式嘛

@jiangjunfeng98
Copy link

jiangjunfeng98 commented Aug 24, 2023

@kuitos 那目前内存增加的问题,有临时解决方案么,可以提供下思路和代码么

有个下下策,让子应用一直存在(主应用对渲染容器keep-alive 或者 挂载数据全局),不卸载,第二次进入也不再重新加载(不二次加载就不存在内存泄漏),只是运行时多耗点内存,还提升了二次进入性能。如果子应用存在leep-alive 处理好退出时状态就行。一个应用初次加载浏览器内存一般在50-70M,测试该方法运行3子应用内存最大值500M+,对比多次卸载、加载导致内存泄漏,完全可接受

@maozhuo123
Copy link

在子应用内,使用loadMicroApp加载其他子应用,第一次加载会很慢,后续就正常,这个问题有解决方案吗?

@jiangjunfeng98
Copy link

在子应用内,使用loadMicroApp加载其他子应用,第一次加载会很慢,后续就正常,这个问题有解决方案吗?

可以试试预加载,但无法解决首次直接通过路由访问子应用慢(优化子应用或抽取应用的公共依赖,进行复用)的问题

手动:https://qiankun.umijs.org/zh/api#prefetchappsapps-importentryopts

自动:https:qiankun.umijs.org/zh/api#startopts

prefetch

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

8 participants