feat(effectScope): add lazy-initialized `signal` getter with automatic abort on stop

[9romise]

This PR introduces a lazy-initialized signal getter on EffectScope.

• When scope.signal is accessed for the first time, an AbortController will be created and its AbortSignal returned.
• If scope.signal is never accessed, no controller will be created, avoiding unnecessary overhead.
• When scope.stop() is called, if an AbortController exists, it will automatically trigger controller.abort().

Related: https://github.com/vuejs/core/pull/13861#issuecomment-3299607953, https://github.com/vuejs/core/pull/13861#issuecomment-3301537346

It would be good to have this for effectScope and watch. This would allow us to get the signal with getCurrentScope.

const {signal} = getCurrentScope()

fetch(url, {signal})

/cc @ferferga, @OrbisK, @antfu

[OrbisK]

Someday, we could follow up on this by merging the effects signal with its parent signals (AbortSignal.any()), which would remove the need for the cleanup array + loop. (Should be benchmarked)

https://github.com/vuejs/core/blob/179b397c4c0b06ab80d376957521ffabf08b0477/packages/reactivity/src/effectScope.ts#L151-L154

[github-actions[bot]]

Size Report

Bundles

File	Size	Gzip	Brotli
compiler-dom.global.prod.js	84 kB	29.8 kB	26.3 kB
runtime-dom.global.prod.js	104 kB (+144 B)	39.2 kB (+45 B)	35.3 kB (+40 B)
vue.global.prod.js	162 kB (+144 B)	59.3 kB (+46 B)	52.9 kB (+9 B)

Usages

Name	Size	Gzip	Brotli
createApp (CAPI only)	47.3 kB (+144 B)	18.5 kB (+52 B)	16.9 kB (+49 B)
createApp	56.2 kB (+144 B)	21.6 kB (+44 B)	19.8 kB (+71 B)
createApp + vaporInteropPlugin	68.7 kB (+144 B)	25.9 kB (+45 B)	23.7 kB (+66 B)
createVaporApp	21 kB (+144 B)	8.31 kB (+50 B)	7.61 kB (+40 B)
createSSRApp	60.4 kB (+144 B)	23.4 kB (+41 B)	21.3 kB (+40 B)
defineCustomElement	61.2 kB (+144 B)	23.2 kB (+47 B)	21.2 kB (+50 B)
overall	70.6 kB (+144 B)	26.9 kB (+53 B)	24.5 kB (+75 B)

[edison1105]

LGTM Similar PR https://github.com/vuejs/core/pull/10826

[coderabbitai[bot]]

[!IMPORTANT]

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

✨ Finishing touches

🧪 Generate unit tests

• [ ] Create PR with unit tests
• [ ] Post copyable unit tests in a comment

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[netlify[bot]]

❌ Deploy Preview for vue-sfc-playground failed. Why did it fail? →

Name	Link
🔨 Latest commit	fe877b95605c4e1ffcc9f3c4ab1bf77caded54af
🔍 Latest deploy log	https://app.netlify.com/projects/vue-sfc-playground/deploys/68d2439b29565a000820be83

[pkg-pr-new[bot]]

Open in StackBlitz

@vue/compiler-core

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

@vue/compiler-dom

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

@vue/compiler-sfc

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

@vue/compiler-ssr

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

@vue/compiler-vapor

npm i https://pkg.pr.new/@vue/compiler-vapor@13908

@vue/reactivity

npm i https://pkg.pr.new/@vue/reactivity@13908

@vue/runtime-core

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

@vue/runtime-dom

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

@vue/runtime-vapor

npm i https://pkg.pr.new/@vue/runtime-vapor@13908

@vue/server-renderer

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

@vue/shared

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

vue

npm i https://pkg.pr.new/vue@13908

@vue/compat

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

commit: 5772a44

[9romise]

Sorry to bother again — I've rebased the PR onto the minor branch. If anything was missed in the earlier review, please take another look. Thanks.

[OrbisK]

@9romise I think I have a proof of concept for replacing the cleanup array with the abort listener: https://github.com/OrbisK/vue-core/commit/a5a6a07b45fd269d13a3a938d9c323cfbed20f55.

The benchmarks are mixed. Maybe you could take a look?

[9romise]

@9romise I think I have a proof of concept for replacing the cleanup array with the abort listener: OrbisK@a5a6a07.

The benchmarks are mixed. Maybe you could take a look?

Awesome! Thanks a lot for your work! I actually gave it a try before rebasing onto the minor branch, but didn’t have the time to clean it up and open a new PR. I’ll work on this shortly and add you as a co-author! Or, if you'd like to handle this yourself, feel free to take over.

[OrbisK]

Go ahead if you have time. I am on holiday for two weeks. 😅