codejump

Scheduler & Internals

Preview — 3 of 10 questions

Why is Vue 3s Proxy-based reactivity more powerful than Vue 2s Object.defineProperty?

AProxy is faster in all browsers; Object.defineProperty is deprecated
BProxy uses less memory because it doesn't create getter/setter for every property
CProxy supports TypeScript; Object.defineProperty does not
DProxy intercepts any operation on an object (get, set, delete, has, ownKeys) making dynamic property addition and deletion reactive; Object.defineProperty only intercepts predefined properties

How does Vue 3 determine when to invalidate a computed property's cache?

ADependency-based invalidation: Vue tracks which reactive values are accessed during the getter's last execution, and marks the computed as "dirty" when any dependency changes
BTime-based expiration — computed values older than one render cycle are recomputed
CReference equality check — if the computed returns the same reference, the cache is valid
DVue compares the computed's return value using JSON.stringify on each render

How does Vue 3's scheduler prevent unnecessary component re-renders when multiple reactive values change synchronously?

AVue re-renders immediately on each state change — there is no batching
BVue queues component update jobs in a microtask queue and flushes all updates at once after the current synchronous execution completes
CVue uses requestAnimationFrame to batch updates at 60fps
DVue merges all synchronous state changes into a single change event using a diff algorithm

Sign up free to play

Answer all 10 questions (7 more), see explanations for every answer, and track your score.