Vue.js 3.5: What's New, Release History & EOL Status

What Is New in Vue.js 3.5

How does the new defineModel macro simplify two-way binding?

The defineModel macro is a game-changer for component authoring. It eliminates the boilerplate of declaring a prop and emitting an update event for v-model bindings. This macro automatically handles the value prop and update:value event, making two-way binding declarations much cleaner.

In practice, this means you can replace multiple lines of code with a single macro call. It works seamlessly with built-in modifiers like .trim and supports custom modifiers, which streamlines component development significantly.

<script setup>
// Before: Manual prop and event declaration
const props = defineProps(['modelValue'])
const emit = defineEmits(['update:modelValue'])

// After: Simplified with defineModel
const modelValue = defineModel()
</script>

What reactive prop destructuring improvements were introduced?

Vue 3.5 now maintains reactivity when destructuring props that contain complex types like objects or arrays. Previously, destructuring would break reactivity, forcing developers to use toRefs or work with the props object directly.

This enhancement means you can safely destructure props in your setup function without losing reactivity tracking. It's a quality-of-life improvement that makes code more intuitive and reduces potential bugs from unexpected loss of reactivity.

<script setup>
const { user, settings } = defineProps<{
  user: User,
  settings: Config
}>()

// Both 'user' and 'settings' remain reactive
</script>

How did computed property performance get better?

Computed properties now track dependencies more efficiently, reducing unnecessary re-computations. The optimization comes from improved dependency tracking algorithms that avoid over-triggering computed values when unrelated reactive states change.

This matters because complex applications with many computed properties will see measurable performance gains. The improvement is most noticeable in components with deep reactive object graphs where previous versions might have triggered more computations than necessary.

What TypeScript enhancements were included?

TypeScript support received several refinements, particularly around SFC script compilation and type inference. The update provides better type checking for component events, slots, and v-model bindings, catching more errors at compile time.

These improvements make the development experience more robust, especially for large codebases. The enhanced type safety reduces runtime errors and improves IDE autocompletion accuracy for Vue-specific constructs.