vue-best-practices

Vue 3 reactivity bugs often stem from misusing refs versus reactive or improper watch and watchEffect usage. Apply composable design patterns and computed properties to avoid hidden side effects and ensure consistent state tracking.

Migrating to the Composition API requires restructuring component logic into script setup syntax, updating props and emits conventions, and replacing lifecycle hooks. Following established best practices prevents inconsistent APIs and costly regressions.

Yes, the guidance covers SSR hydration strategies, KeepAlive caching, and async component patterns. It provides recommendations to optimize performance, handle transition pitfalls, and reduce bundle size.

TypeScript typing patterns for Vue 3 involve correctly typing custom directives, lifecycle hook registrations, and v-model or defineModel behaviors. Applying these rules ensures strict type safety and maintainable architecture.

Vue 3 watchEffect can create hidden side effects when used improperly instead of watch or computed properties. Use precise watch sources and computed properties for derived state to avoid unnecessary reactivity triggers.

Yes, you can use these Vue 3 best practices for code reviews, onboarding, and debugging. Ask the skill to review a component or directory to list detected violations and provide concrete fixes.