core icon indicating copy to clipboard operation
core copied to clipboard

fix(keep-alive): avoid duplicate mounts of deactivate components

Open yangxiuxiu1115 opened this issue 1 year ago • 16 comments

try to fix #12017 also fix https://github.com/vuejs/router/issues/626

yangxiuxiu1115 avatar Sep 26 '24 11:09 yangxiuxiu1115

Size Report

Bundles

File Size Gzip Brotli
runtime-dom.global.prod.js 100 kB (+301 B) 38.1 kB (+113 B) 34.3 kB (+83 B)
vue.global.prod.js 158 kB (+301 B) 57.9 kB (+94 B) 51.6 kB (+93 B)

Usages

Name Size Gzip Brotli
createApp (CAPI only) 46.6 kB (+203 B) 18.3 kB (+73 B) 16.7 kB (+64 B)
createApp 54.5 kB (+203 B) 21.2 kB (+65 B) 19.4 kB (+72 B)
createSSRApp 58.8 kB (+203 B) 23 kB (+64 B) 20.9 kB (+65 B)
defineCustomElement 59.4 kB (+203 B) 22.8 kB (+80 B) 20.8 kB (+47 B)
overall 68.7 kB (+301 B) 26.4 kB (+106 B) 24.1 kB (+99 B)

github-actions[bot] avatar Sep 26 '24 11:09 github-actions[bot]

Open in Stackblitz

@vue/compiler-core

npm i https://pkg.pr.new/@vue/compiler-core@12042
@vue/compiler-ssr

npm i https://pkg.pr.new/@vue/compiler-ssr@12042
@vue/compiler-dom

npm i https://pkg.pr.new/@vue/compiler-dom@12042
@vue/compiler-sfc

npm i https://pkg.pr.new/@vue/compiler-sfc@12042
@vue/reactivity

npm i https://pkg.pr.new/@vue/reactivity@12042
@vue/runtime-core

npm i https://pkg.pr.new/@vue/runtime-core@12042
@vue/runtime-dom

npm i https://pkg.pr.new/@vue/runtime-dom@12042
@vue/server-renderer

npm i https://pkg.pr.new/@vue/server-renderer@12042
@vue/shared

npm i https://pkg.pr.new/@vue/shared@12042
vue

npm i https://pkg.pr.new/vue@12042
@vue/compat

npm i https://pkg.pr.new/@vue/compat@12042

commit: 436296c

pkg-pr-new[bot] avatar Sep 26 '24 11:09 pkg-pr-new[bot]

I tested the preview package(pnpm add https://pkg.pr.new/vue@12042) of this PR in the reproduction of #12017. The b.vue is still mounted twice.

edison1105 avatar Sep 26 '24 13:09 edison1105

It seems that only the examples in the playground have been fixed, I thought they were the same issue

yangxiuxiu1115 avatar Sep 26 '24 15:09 yangxiuxiu1115

/ecosystem-ci run

edison1105 avatar Sep 27 '24 07:09 edison1105

📝 Ran ecosystem CI: Open

suite result latest scheduled
language-tools :x: failure :x: failure
nuxt :white_check_mark: success :white_check_mark: success
pinia :white_check_mark: success :white_check_mark: success
primevue :white_check_mark: success :white_check_mark: success
quasar :white_check_mark: success :white_check_mark: success
radix-vue :white_check_mark: success :white_check_mark: success
router :white_check_mark: success :white_check_mark: success
test-utils :white_check_mark: success :white_check_mark: success
vant :white_check_mark: success :white_check_mark: success
vite-plugin-vue :white_check_mark: success :white_check_mark: success
vitepress :white_check_mark: success :white_check_mark: success
vue-i18n :white_check_mark: success :white_check_mark: success
vue-macros :x: failure :x: failure
vuetify :white_check_mark: success :white_check_mark: success
vueuse :white_check_mark: success :x: failure
vue-simple-compiler :white_check_mark: success :white_check_mark: success

vue-bot avatar Sep 27 '24 07:09 vue-bot

kind of strange, doesn't seem to have much relevance, might need to merge the master branch 😄

yangxiuxiu1115 avatar Sep 27 '24 08:09 yangxiuxiu1115

/ecosystem-ci run

edison1105 avatar Feb 05 '25 08:02 edison1105

📝 Ran ecosystem CI: Open

suite result latest scheduled
language-tools :white_check_mark: success :white_check_mark: success
nuxt :white_check_mark: success :white_check_mark: success
pinia :white_check_mark: success :white_check_mark: success
primevue :white_check_mark: success :white_check_mark: success
quasar :white_check_mark: success :white_check_mark: success
radix-vue :white_check_mark: success :white_check_mark: success
router :white_check_mark: success :white_check_mark: success
test-utils :white_check_mark: success :white_check_mark: success
vant :white_check_mark: success :white_check_mark: success
vite-plugin-vue :x: failure :white_check_mark: success
vitepress :white_check_mark: success :white_check_mark: success
vue-i18n :white_check_mark: success :white_check_mark: success
vue-macros :x: failure :white_check_mark: success
vuetify :white_check_mark: success :white_check_mark: success
vueuse :white_check_mark: success :white_check_mark: success
vue-simple-compiler :white_check_mark: success :white_check_mark: success

vue-bot avatar Feb 05 '25 08:02 vue-bot

/ecosystem-ci run

edison1105 avatar Feb 05 '25 08:02 edison1105

📝 Ran ecosystem CI: Open

suite result latest scheduled
language-tools :white_check_mark: success :white_check_mark: success
nuxt :x: failure :white_check_mark: success
pinia :white_check_mark: success :white_check_mark: success
primevue :white_check_mark: success :white_check_mark: success
quasar :white_check_mark: success :white_check_mark: success
radix-vue :white_check_mark: success :white_check_mark: success
router :white_check_mark: success :white_check_mark: success
test-utils :white_check_mark: success :white_check_mark: success
vant :white_check_mark: success :white_check_mark: success
vite-plugin-vue :white_check_mark: success :white_check_mark: success
vitepress :white_check_mark: success :white_check_mark: success
vue-i18n :white_check_mark: success :white_check_mark: success
vue-macros :x: failure :white_check_mark: success
vuetify :white_check_mark: success :white_check_mark: success
vueuse :white_check_mark: success :white_check_mark: success
vue-simple-compiler :white_check_mark: success :white_check_mark: success

vue-bot avatar Feb 05 '25 08:02 vue-bot

@yangxiuxiu1115 I've made some minor tweaks, see https://github.com/vuejs/core/pull/12042/commits/436296c5f1b20c17ba94fd9ce04c7f78f38d52eb

edison1105 avatar Feb 05 '25 12:02 edison1105

fcee32616a14fafc29841f643ee1f169989dbbef might be more appropriate, being able to omit some of the loops, though it might need some tweaking(which probably won't have much of an impact on performance, maybe it's not necessary?)

yangxiuxiu1115 avatar Feb 05 '25 14:02 yangxiuxiu1115

@yangxiuxiu1115 I tested https://github.com/vuejs/core/commit/fcee32616a14fafc29841f643ee1f169989dbbef with #12017's reproduction and it's not correct. Although the test case of this PR passed, #12017 is still not working as expected. Perhaps the current test cases do not fully match the reproduction of #12017. so I reverted it.

edison1105 avatar Feb 05 '25 14:02 edison1105

This is the solution to the problem - https://github.com/vuejs/router/issues/626. Which is also a bug in my project when mounting keep-alive children. After all this time it still hasn't been approved?

TheMaksKryt avatar May 21 '25 14:05 TheMaksKryt

This is the solution to the problem - vuejs/router#626. Which is also a bug in my project when mounting keep-alive children. After all this time it still hasn't been approved? @yangxiuxiu1115, @edison1105, Any ideas how this solution can be promoted to the main branch?

TheMaksKryt avatar May 21 '25 14:05 TheMaksKryt