What is the Composition API
Until now, when we were creating a new component we were using Options API. Now in Vue 3, Composition API has been introduced. Just to get the obvious concern out of the way, this new API will not break current Vue 2.x options-based code! We can even continue to use the Options API in Vue 3. The Composition API is just an addition to the language that was created to address the limitations of the Options API used in Vue 2.
Evan You, the creator of Vue, has described the Composition API as a reactive API coupled with the ability to register lifecycle hooks using globally imported functions.
Why Composition API?
There are currently three limitations you may have run into when working with Vue 2:
- As your components get larger readability gets difficult.
- The current code reuse patterns all come with drawbacks.
- Vue 2 has limited TypeScript support out of the box.
Better extensibility and organization
One major concern among developers was that their Vue projects became hard to manage as they grew in size and complexity.
Because of this, logic isn't really grouped by feature, which can make it hard to read through a large and complex file. Readers would often have to scroll back and forth to follow what's going on.
Better TypeScript support
The next issue with Vue 2.x was that the sometimes confusing nature of this inside components often made it difficult to use TypeScript. The Options API relies on a lot of "magic" from the Vue compiler.
Top comments (0)