Vue 3.5 introduces significant improvements to the framework’s reactivity system, enhancing both performance and memory usage. As a minor release with no breaking changes, this update is designed to refine the existing features without disrupting developers’ workflows. One of the standout improvements is the optimization of memory usage, with a remarkable 56% reduction. This makes Vue 3.5 more efficient while keeping the underlying behavior intact, ensuring smoother performance for developers and users alike. This update reaffirms Vue’s commitment to maintaining an evolving yet stable ecosystem.
A key area of focus in Vue 3.5 is improving the handling of computed values and memory management, particularly in server-side rendering (SSR) scenarios. The update addresses the issue of stale computed values, which had previously caused memory issues due to hanging computes. Vue’s reactivity system now efficiently tracks changes in large, deeply reactive arrays, making updates up to 10 times faster in some cases. This boosts the overall responsiveness of Vue applications, especially in complex data-driven scenarios. Additionally, destructuring reactive props has been stabilized and is enabled by default, which simplifies working with props that have default values.
For SSR improvements, Vue 3.5 introduces greater control over the hydration process for asynchronous components. By using the new hydrate option in the defineAsyncComponent() API, developers can now specify when components should be hydrated, providing more flexibility in how content is rendered on the server and client. The update also resolves longstanding issues related to the defineCustomElement() API, adding new capabilities for creating custom elements in Vue applications. These changes reflect Vue’s dedication to optimizing SSR performance while expanding the framework’s capabilities.
Vue 3.5 further enhances developer experience with several new features. The introduction of the useTemplateRef() API provides a new method for obtaining template references, improving the clarity and flexibility of template interactions. Another notable addition is the defer prop for the <Teleport> component, which ensures that the component is mounted only after the current render cycle, reducing unnecessary re-renders. Vue 3.5 also adds a globally imported onWatcherCleanup() API, making it easier to register cleanup callbacks in watchers, offering a more efficient way to handle reactive data lifecycle events. These updates reinforce Vue 3.5 as a polished release, focusing on performance, memory efficiency, and enhanced developer tools.