Composition API Best Practices
summary
Argues practical rules: prefer refs by default for library consistency, wrap raw inputs so functions accept either a ref or a static value, and split big setup blocks into reusable composables. Demonstrates using watch with onCleanup to add and remove DOM listeners robustly and returning read-only computed or readonly objects to prevent external mutation. Cites real code (awesome.jsdf site is entirely Composition API) and shows these patterns are implemented and working at scale.
AI-written summary · about
chapters (11)
- 0:00Start
- 6:36COMPUTED PROPERTIES ARE REFS
- 8:00DOM REFERENCES REQUIRE (TEMPLATE) REFS
- 9:20SO... ARE YOU TELLING ME THAT REACTIVE() IS USELESS?
- 10:23EMERGING BEST PRACTICES by example
- 15:26HANDLING REFS IN ARGUMENTS
- 17:27CAN WE ACCEPT BOTH REF & STATIC VALUES?
- 18:50FORGIVING API VS. STRICT API
- 19:17LIFECYCLE HOOKS VS. WATCH
- 20:47WATCHO TO THE RESCUE
- 23:00RETURN COMPUTED RETURN REF
related talks
28mComposition API: a Quick overVue
27mHow to write better composables
46mComposable Vue 3
47mVue’s Composition API: Why it’s Important
21mVue 3 and Composition API
31mIntroduction to Vue 3's Composition API
22mOptions API vs Composition API: Choosing the Right Approach for Your Team
32mScalable Front End Architecture with the Composition API and Composable Functions