-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
fix(core/vue): Detect and skip normalizing Vue VNode objects with high normalizeDepth
#18206
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
fix(core/vue): Detect and skip normalizing Vue VNode objects with high normalizeDepth
#18206
Conversation
size-limit report 📦
|
node-overhead report 🧳Note: This is a synthetic benchmark with a minimal express app and does not necessarily reflect the real-world performance impact in an application.
|
s1gr1d
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice fix!
| return !!( | ||
| typeof wat === 'object' && | ||
| wat !== null && | ||
| ((wat as VueViewModel).__isVue || (wat as VueViewModel)._isVue || (wat as { __v_isVNode?: boolean }).__v_isVNode) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
l/m: Could we add a comment here explaining a little bit what we're doing?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yea absolutely
Fixes #18203
Problem
When using
normalizeDepth: 10withcaptureConsoleIntegrationenabled, Vue VNodes in console arguments would trigger recursive warning spam. Accessing VNode properties during normalization would trigger Vue's reactive getters, which emit console warnings. These warnings would then be captured and normalized again, creating a recursive loop that could generate hundreds of warnings.Note that this only happens in
devmodeSolution
Changed
isVueViewModel()to detect Vue 3 VNodes (__v_isVNode: true) in addition to Vue 2/3 ViewModels. VNodes are now identified early in the normalization process and stringified as[VueVNode]before their properties are accessed, preventing the recursive warning loop.Some of the properties on the
VNodecan also be reactive, so it can incorrectly add those to a watchEffect or a render function reactive dependencies when accessed by the normalizer.Changes
packages/core/src/utils/is.ts: Added__v_isVNodecheck toisVueViewModel().packages/core/src/utils/normalize.ts: Distinguish VNodes from ViewModels in output ([VueVNode]vs[VueViewModel]).I couldn't reproduce this exactly in a test with a real vue component, but verified it fixes the reproduction example.
The before and after of the captured logs:
Before:
After:
As a Vue developer I don't think the loss of information here would help debug anything.