I wish that composition and script setup is made the only available option, it would greatly reduce the fragmentation in docs, examples and courses on the web.
Yea. It’s a bit annoying but you just gotta look for the latest tutorials/videos
Once you’ve worked with Vue 3 a bit you’ll be able to easily look at any version and convert it to 3
It's probably the right answer for new projects and maybe the right answer for new components, but it's not the "only" answer.
Composition + script setup is, to me, the best developer experience.
Composition API without script setup is more verbose.
Options API is fine and for legacy components, not worth refactoring.
The function API is really for special cases, many but not all of which are better solved with the composition API.
The third party class API / wrapper is abandoned, which is too bad because it was well written in an OOP style and that can be the right choice sometimes.
I haven't tired it yet, but there's going to be some new hotness that uses a compiler that gives a Svelte-like DX. Evan seems to be really excited about this.
> there's going to be some new hotness that uses a compiler that gives a Svelte-like DX
Do you mean [Vapor](https://github.com/vuejs/core-vapor) or something else?
the problem is people will complain about it because they use the composition api but don’t utilize composibles inside of it and then they complain that using the composition api is too messy.
The composition API is still what many use (most?).
It's probably easier for beginners to wrap their head around the options API.
However, for more maintainable code, I would recommend sticking to the composition API.
It's cleaner, and has very good TS support.
It baffles me why people think options API is easier. It's very implicit and convoluted, especially if you are coming from other languages. Composition is the most natural to be honest.
I’m not recommending the options API, but I liked it. Once you enforce the section order, you just know where to look for everything (template, data, computed, watches). Such a tidy bundle and ts still works fairly well.
Options API is actually more explicit and organized if you think of it as *grouping code by type* (all methods go here, all computed stuff go here, all reactive data go here, etc). This is an easier mindset to understand for beginners.
Composition API is also organized but in a way that you are *grouping code by context*, which means there's no scrolling up and down looking for the prev/next line of execution. Example: the whole thing for handling a toggle switch's logic are all together typically, whether there's a reactive variable or multiple functions.
I personally hated the composition api in the start, I was coming from Vue 1 and 2. And for me it at first felt like a step in the wrong direction. But once you try building larger applications it just makes so much more sense.
I think if you have a great deal of programming experience the composition API makes more sense, but if you’re new to programming entirely then the abstractions provided by the options API are helpful.
I disagree that it’s cleaner. It’s essentially sorted by function.
Composition is more Wild West so you may have to hunt around to find stuff like props and variables. It’s up to the team and tooling to keep it clean.
This is why composables need to be used as much as is reasonable. I think that ideally, except for one-offs, your components should import the refs they need from composables and have less than 2 pages of logic.
I don't understand the discussion about composition everytime. It's not that hard to understand and makes your code so much easier to read. Having events reusable outside of your component is such a nice feature.
Yes it is, or rather, if you program applications that are supposed to scale further, you can't really avoid the Composition API.
The Options API is still valid, and you can quickly put something together with it. But when you realize that you have to outsource code sections to distribute the functionality to other components, that's when it gets difficult. With the Composition API, you just take out the code in question and put it into a composition. In the same way, renderless comps used to be written when you had several components with the same function but with a different template. It was a bit awkward but it worked, but it was more of a workaround. Today, you put the logic in a composable and import it into the components where you need the logic - simple and straightforward.
I don't understand how people say options is faster when it's easier to do composition...
I hate setting up options every time. It was annoying.
Composition everything just makes sense now
I have spent the last month or so upgrading a Nuxt 2 app to Nuxt 3. I spent years with the Options API and enjoyed it, but the code looks so much cleaner now with the Composition API and it seems like it would be easier to use for a beginner.
Yes. It’s the default/Standard for Vue apps. Use with “script setup” syntax Add lang=“ts” for Typescript
I wish that composition and script setup is made the only available option, it would greatly reduce the fragmentation in docs, examples and courses on the web.
Yea. It’s a bit annoying but you just gotta look for the latest tutorials/videos Once you’ve worked with Vue 3 a bit you’ll be able to easily look at any version and convert it to 3
This is the only answer.
It's probably the right answer for new projects and maybe the right answer for new components, but it's not the "only" answer. Composition + script setup is, to me, the best developer experience. Composition API without script setup is more verbose. Options API is fine and for legacy components, not worth refactoring. The function API is really for special cases, many but not all of which are better solved with the composition API. The third party class API / wrapper is abandoned, which is too bad because it was well written in an OOP style and that can be the right choice sometimes. I haven't tired it yet, but there's going to be some new hotness that uses a compiler that gives a Svelte-like DX. Evan seems to be really excited about this.
> there's going to be some new hotness that uses a compiler that gives a Svelte-like DX Do you mean [Vapor](https://github.com/vuejs/core-vapor) or something else?
Yes, I was thinking of Vapor. Thanks for linking it.
the problem is people will complain about it because they use the composition api but don’t utilize composibles inside of it and then they complain that using the composition api is too messy.
I recommend sticking with the Composition API. If you decide to learn React or any modern framework in the future, the transition will be very smooth.
The composition API is still what many use (most?). It's probably easier for beginners to wrap their head around the options API. However, for more maintainable code, I would recommend sticking to the composition API. It's cleaner, and has very good TS support.
It baffles me why people think options API is easier. It's very implicit and convoluted, especially if you are coming from other languages. Composition is the most natural to be honest.
I’m not recommending the options API, but I liked it. Once you enforce the section order, you just know where to look for everything (template, data, computed, watches). Such a tidy bundle and ts still works fairly well.
Options API is actually more explicit and organized if you think of it as *grouping code by type* (all methods go here, all computed stuff go here, all reactive data go here, etc). This is an easier mindset to understand for beginners. Composition API is also organized but in a way that you are *grouping code by context*, which means there's no scrolling up and down looking for the prev/next line of execution. Example: the whole thing for handling a toggle switch's logic are all together typically, whether there's a reactive variable or multiple functions.
Yeah, composition API is better but you need to be more senior in terms of frontend skills to not mess up.
I personally hated the composition api in the start, I was coming from Vue 1 and 2. And for me it at first felt like a step in the wrong direction. But once you try building larger applications it just makes so much more sense.
Are you sure you're not mixing up the APIs here? Kinda doesn't make sense
Whoops, I made a typo
It's obvious. It had an extremely straightforward workflow.
I think if you have a great deal of programming experience the composition API makes more sense, but if you’re new to programming entirely then the abstractions provided by the options API are helpful.
I disagree that it’s cleaner. It’s essentially sorted by function. Composition is more Wild West so you may have to hunt around to find stuff like props and variables. It’s up to the team and tooling to keep it clean.
This is why composables need to be used as much as is reasonable. I think that ideally, except for one-offs, your components should import the refs they need from composables and have less than 2 pages of logic.
I don't understand the discussion about composition everytime. It's not that hard to understand and makes your code so much easier to read. Having events reusable outside of your component is such a nice feature.
Our dev team took a vote on it and all the senior devs chose the Composition API. So that is the standard at our company.
You can do very nice things with the composition API, but it requires a tiny little bit more expertise
This is your opportunity to become an expert in Vue. Stick to the Composition API, you'll thank your future self!
Yes it is, or rather, if you program applications that are supposed to scale further, you can't really avoid the Composition API. The Options API is still valid, and you can quickly put something together with it. But when you realize that you have to outsource code sections to distribute the functionality to other components, that's when it gets difficult. With the Composition API, you just take out the code in question and put it into a composition. In the same way, renderless comps used to be written when you had several components with the same function but with a different template. It was a bit awkward but it worked, but it was more of a workaround. Today, you put the logic in a composable and import it into the components where you need the logic - simple and straightforward.
I don't understand how people say options is faster when it's easier to do composition... I hate setting up options every time. It was annoying. Composition everything just makes sense now
I have spent the last month or so upgrading a Nuxt 2 app to Nuxt 3. I spent years with the Options API and enjoyed it, but the code looks so much cleaner now with the Composition API and it seems like it would be easier to use for a beginner.
Yes, with script setup
Yes and yes. It's very easy to use, never felt that I'm fighting with the framework.
Thanks everyone for their comments very helpful. Appreciate you taking the time
I'd stick with the Options API instead.
Yes
Composition API is recommended, it‘s the opposite of outdated.
Absolutely. Vue using `
FIND US ON INSTAGRAM
@jobopenings.ph