In this session, Evan You talks about the new Vue 3 experience: from new syntax to new docs, build tools, devtools, and TS/IDE. Jobs - Abyat is looking to hire talented developers for their new world class product. Apply now: www.abyat.com/careers?VTC&VTC Looking to hire new developers? Post your jobs at vuejobs.com Slide: docs.google.com/presentation/d/1NntydB8nwtTpcIuKg6O1s_ZeGJKtffTn39Wi1OHhts0/edit#slide=id.p
Honestly, I just wish they would have a better documentation for Vue 3. Sucks so much being stuck with options API documentation on Vue 3's with a small portion of composition API in a tiny place of the documentation. This is the case when the script setup is supposed to be the way "forward".
That's the idea - last I heard, they were planning on adding the ability to toggle between Options/Composition API in all examples. I personally wish they would stop making globally registered `Vue.template` components so prevalent throughout the docs. Having used Vue professionally for the last few years, I can say it's very uncommon to use a global template component versus a SFC.
The new docummentation is a very needed step right now. But luckily its right around the corner. I already had a sneakpeak of it and it looks incredible
Not sure if it's a good thing that Vue is more and more becoming magic for the average developer. But Vue 3 is definitely a lot more ergonomic than Vue 2.
I have similar feelings. I loved Vue because it was dead-simple. Now I don't even try to follow what is being discussed as it already feels like too complex and too magic.
@finance The idea that you prefer Svelte because it has less "magic" is probably the funnies thing I heard in a while. I like Svelte, but Svelte is like the epitome of "magic" code. Vue doesnt even come close to the amount of "magic" Svelte does. If you think wrapping a reactive value in a ref function is "magic" but having those same values magically reactive and $ signs everywhere isnt then I think you might be confused. Also theres just no way I can take you seriously if you think Vue is "terrible for anything remotley complex." Svelte literally has you changing APIs whenever you want to share code across components. Vue composables are like leauges more modular and sharable across components. You can prefer Svelte if you like but the idea that Vue is so much worse at code composition(which is what you want for scalability) is so beyond reasonable discussion its easier to just assume right off the bat you dont have the slightest idea what you are talking about
@@jp2886 I dont get whats more magic with Vue 3. To my mind the composition API is closer to the actual javascript than the Options API ever was. By all reasonable judgment Vue 3 is less magic. Because you are much closer to the underlying reactivity system now. Also, even interally Vue 3 is less magic because the new reactivity system is now just taking advantage of more native modern Javascript like proxy & reflect. Where the old version had a system that was much more "custom." Vue 3 is literally shedding "magic" and getting closer both to its own systems and to the native modern browser
@@samuelmorkbednarzkepler You are probably right about it being closer to the metal now. It's definitely that I got spoiled by the easy of use of Vue2 that now these concepts seem to be on another level of complexity from that perspective. Vue2 indeed made me able to forget about JS main concepts (like "this", in Vue2 lost the JS sense, but makes a lot of sense from the SFC perspective) as it was handling it all for me. So what I should really write in the first comment would be that Vue3 seems no longer to be such easy and hand-holding compared to Vue2.
I really had not so great experience with vue 2 when it comes to DX and TS while working on a large scale project. Glad to see the major improvements in vue 3 in terms of DX for vue files. I don't mind if things become little complex for a much better DX, small price to pay. Also, the flexible devtools plugins support looks awesome.
Well... I hope that nobody will use this magic $ sign compiler. If writing .value is too hard and it requires writiting special compiler plugin to let him just add this short word, then I'm kinda worried how much more magic Vue is going to introduce. However the rest of the presentation was 🔥 Can't wait until I would be able to finally left Webpack for Vite :)
@@simarbaggac-2025 I did angular 2 when it was new, now it's almost the same from developer perspective. Bdw, this problem is common in JS world. It's much more relaxed in other languages, you can learn something now and use it 10-15 years later
There is not good replacement in the IDE for tsc. Many of the TS IDE integrations are buggy. Vite should include first class support for tsc and use a non-blocking process to check types inline in the development flow similar to the webpack ts-fork loader. I would consider Vite if that was the case. I want to check my types immediately as I'm developing not as an afterthought or through a secondary experience.
I'm so sick of writing an application with a framework only to find myself having to basically rewrite it every 2 years because "frameworks need to evolve".
Typescript is not the only reason why you would wanna switch to Pinia. Tldr: Pinia offers better DX even for projects written in JS compared to Vuex 4 or earlier. In terms of syntax, Pinia takes an approach closer to vanilla js. Actions are invoked as calling simple js functions compared to Vuex 4 or earlier where you pass some magical strings or use mappers to execute them and this result in bad DX. For eg: you can't peek into an action's definition wherever it is invoked. You would have to manually go through your store and open that particular file where that action is defined. Having a better TS support also means you get better intellisense out of your editor (if it supports intellisense) even if you don't use TS. Another advantage is pinia stores are tree shakeable, Vuex store isn't.
Why is Vite pronounced "veet" and not "vight"? This is a real question. I hear the creator pronounce it like "veet" but he also spelled it like "vight". In chinese Vite would be like "Vi Te", pronounced "Vee Tuh" but he did not say the "Tuh". I know it is a lame question but I want to know..
Yeah. Had this argument with another developer. Though he won once he showed me that it literally says how to pronounce it on the first line of the documentation.
@@maximiliaanvandijk6111 🤣 Yeah I had no doubt that is was pronounced 'veet' (in this video the leader of Vue says 'veet', I was just interested in why
Still a bit disappointed about the lack of REAL typescript use. The trick they did with script setup.... while it should have been resolved with some decorators and class.... let's wait for vue 4 and hope for the best ;)
Very little is actually broken between Vue 2 and Vue 3 though. The options API works great still. Considering they rewrote the entire thing in typescript I think they did an incredible job keeping it as nonbreaking as possible. I think they dont get enough credit for this
@@JaeTLDR1 i am not against that, but the filter is very annoying to look at. makes me not want to look at him at all. that i think defeats the purpose of having a cam
Do we really need more front end frameworks ? There needs to come a point where the community chooses one main thing and just make that better. We don’t need vue, angular, react, blah blah blah. Just everyone focus on react
This is silly. React is not a one-size-fits-all solution and could never be. Competition is necessary to encourage innovation and cover different use cases.
In this session, Evan You talks about the new Vue 3 experience: from new syntax to new docs, build tools, devtools, and TS/IDE.
Jobs -
Abyat is looking to hire talented developers for their new world class product. Apply now: www.abyat.com/careers?VTC&VTC
Looking to hire new developers? Post your jobs at vuejobs.com
Slide: docs.google.com/presentation/d/1NntydB8nwtTpcIuKg6O1s_ZeGJKtffTn39Wi1OHhts0/edit#slide=id.p
19:31 summary
21:41 new composition api DX script setup
22:46, 23:21 new documentations
- 25:27 vue3 by default
27:17 Upcoming Reactivity Transform
31:43 props destructure transform
I made the right choice to use Vue when I started my project a year ago.
Said every person experiencing sunken cost fallacy ever :)
@@JLarky Couldn't this be said in response to anyone saying they liked any development tool ever?
Honestly, I just wish they would have a better documentation for Vue 3. Sucks so much being stuck with options API documentation on Vue 3's with a small portion of composition API in a tiny place of the documentation. This is the case when the script setup is supposed to be the way "forward".
That's the idea - last I heard, they were planning on adding the ability to toggle between Options/Composition API in all examples.
I personally wish they would stop making globally registered `Vue.template` components so prevalent throughout the docs. Having used Vue professionally for the last few years, I can say it's very uncommon to use a global template component versus a SFC.
what? I think your problem is not with vue, your problem is with javascript, because everything is very easy and intuitive.
The new docummentation is a very needed step right now. But luckily its right around the corner. I already had a sneakpeak of it and it looks incredible
Not sure if it's a good thing that Vue is more and more becoming magic for the average developer. But Vue 3 is definitely a lot more ergonomic than Vue 2.
Is more magic for all developers
I have similar feelings. I loved Vue because it was dead-simple. Now I don't even try to follow what is being discussed as it already feels like too complex and too magic.
@finance The idea that you prefer Svelte because it has less "magic" is probably the funnies thing I heard in a while. I like Svelte, but Svelte is like the epitome of "magic" code. Vue doesnt even come close to the amount of "magic" Svelte does. If you think wrapping a reactive value in a ref function is "magic" but having those same values magically reactive and $ signs everywhere isnt then I think you might be confused.
Also theres just no way I can take you seriously if you think Vue is "terrible for anything remotley complex." Svelte literally has you changing APIs whenever you want to share code across components. Vue composables are like leauges more modular and sharable across components. You can prefer Svelte if you like but the idea that Vue is so much worse at code composition(which is what you want for scalability) is so beyond reasonable discussion its easier to just assume right off the bat you dont have the slightest idea what you are talking about
@@jp2886 I dont get whats more magic with Vue 3. To my mind the composition API is closer to the actual javascript than the Options API ever was. By all reasonable judgment Vue 3 is less magic. Because you are much closer to the underlying reactivity system now. Also, even interally Vue 3 is less magic because the new reactivity system is now just taking advantage of more native modern Javascript like proxy & reflect. Where the old version had a system that was much more "custom." Vue 3 is literally shedding "magic" and getting closer both to its own systems and to the native modern browser
@@samuelmorkbednarzkepler You are probably right about it being closer to the metal now. It's definitely that I got spoiled by the easy of use of Vue2 that now these concepts seem to be on another level of complexity from that perspective. Vue2 indeed made me able to forget about JS main concepts (like "this", in Vue2 lost the JS sense, but makes a lot of sense from the SFC perspective) as it was handling it all for me. So what I should really write in the first comment would be that Vue3 seems no longer to be such easy and hand-holding compared to Vue2.
I really had not so great experience with vue 2 when it comes to DX and TS while working on a large scale project.
Glad to see the major improvements in vue 3 in terms of DX for vue files.
I don't mind if things become little complex for a much better DX, small price to pay.
Also, the flexible devtools plugins support looks awesome.
Well... I hope that nobody will use this magic $ sign compiler. If writing .value is too hard and it requires writiting special compiler plugin to let him just add this short word, then I'm kinda worried how much more magic Vue is going to introduce.
However the rest of the presentation was 🔥 Can't wait until I would be able to finally left Webpack for Vite :)
6:07 to explain to your manager why you want vite and not vue cli
I love these update videos. Very exciting! Thank you!
Svelte with extra steps 😝
How does this affect Quasar? Is Vue 3 too far gone the library-framework continum to fit the role it was given in Quasar?
I think the $ character should never be used anywhere, let alone two of them, its just utterly confusing.
Everything about vue seems so great and healthy
Literally everything seems unhealty, they change it every year.
@@siux94 other frameworks do the same, can you explain more?
@@simarbaggac-2025 I did angular 2 when it was new, now it's almost the same from developer perspective.
Bdw, this problem is common in JS world. It's much more relaxed in other languages, you can learn something now and use it 10-15 years later
$ref is huge! great to see a simplification there
always good to listen to you Evan, I really like the innovation behind Vue, thanks
With the depreciation of Vue CLI, what will become Vue UI ? I love that GUI
May you add link to slides? Thanks
It's now added in the description area
I don't use Vue much but whenever I do, it feels like lots of stuff duct-taped together.
Another cli tool ah just what I need
I want Ref Transforms now!
that looks like svelte
Then why not just enable them. They're already supported in Vue via an experimental option.
There is not good replacement in the IDE for tsc. Many of the TS IDE integrations are buggy. Vite should include first class support for tsc and use a non-blocking process to check types inline in the development flow similar to the webpack ts-fork loader. I would consider Vite if that was the case. I want to check my types immediately as I'm developing not as an afterthought or through a secondary experience.
So with reactive veriables it is actully Svelte js :)
Evan learns the best lessons from existing frameworks such Angular, React, Svelte etc... this is why Vue keep evolving and getting better
It may keep getting better, but it’ll never be react
It doesn't have to be react, as long as it's actively managed, it's good enough.
Yeah it'll never be React because it's not a slow-ass unintuitive garbage tightly related to a monstrosity called JSX
In nuxt 2(vuejs 2) there is a middleware client side concept , what about vuejs 3 🙂
what ill give to learn from evan.....i need him as a mentor
where can I read about $ref?
I'm so sick of writing an application with a framework only to find myself having to basically rewrite it every 2 years because "frameworks need to evolve".
Vue 2 had more than 4 years, what's you complaining about? 😂.
Solution: do something else in IT field
@@GoonCity777 No. Solution: work with what is built-in in the DOM API instead.
What about Vuex support in Vue devtools?
It is supported
Yea, long time ago, is working almost perfectly
I dont like to have to switch to another state library, just to receive some types while im not even using typescript.
Typescript is not the only reason why you would wanna switch to Pinia.
Tldr: Pinia offers better DX even for projects written in JS compared to Vuex 4 or earlier.
In terms of syntax, Pinia takes an approach closer to vanilla js.
Actions are invoked as calling simple js functions compared to Vuex 4 or earlier where you pass some magical strings or use mappers to execute them and this result in bad DX. For eg: you can't peek into an action's definition wherever it is invoked. You would have to manually go through your store and open that particular file where that action is defined.
Having a better TS support also means you get better intellisense out of your editor (if it supports intellisense) even if you don't use TS.
Another advantage is pinia stores are tree shakeable, Vuex store isn't.
Vue... This is the way
why do js devs have to break everything each couple years - 3 major versions! im out
Because technology is an ever-improving treadmill and anyone who stands still for too long falls off.
@@CRiley-zx1ws Say that to Wordpress user !
@@CRiley-zx1ws No it isn't. Try working in Java or Ruby on Rails - they are still the same many years later.
@@JP-hb4mv Though both are not considered the pinnacle of programming languages/frameworks.
Why is Vite pronounced "veet" and not "vight"? This is a real question. I hear the creator pronounce it like "veet" but he also spelled it like "vight". In chinese Vite would be like "Vi Te", pronounced "Vee Tuh" but he did not say the "Tuh". I know it is a lame question but I want to know..
It's a French word. Means quick, and it is pronounced like 'veet'.
Its a french word. Meaning fast, quick. Pronounced as \ ˈvēt \
dictionary.cambridge.org/dictionary/french-english/vite
Wow thank you both!
Yeah. Had this argument with another developer. Though he won once he showed me that it literally says how to pronounce it on the first line of the documentation.
@@maximiliaanvandijk6111 🤣
Yeah I had no doubt that is was pronounced 'veet' (in this video the leader of Vue says 'veet', I was just interested in why
Still a bit disappointed about the lack of REAL typescript use. The trick they did with script setup.... while it should have been resolved with some decorators and class.... let's wait for vue 4 and hope for the best ;)
Does Volar support Vue 2?
sort of, meaning it brings slight improvements, but it was mostly made for vue 3.
Will Vue overtake React? *dunh dunh*
you are code jesus..
I like the new improvements, But it's about time we stop breaking everything in the ecosystem every time a major version is out.
Very little is actually broken between Vue 2 and Vue 3 though. The options API works great still. Considering they rewrote the entire thing in typescript I think they did an incredible job keeping it as nonbreaking as possible. I think they dont get enough credit for this
8:41
React is the better, React is best
мой комент
can we agree on the fact that this blurred background thing is pure cancer?
He is probably at home. Its totally fair not to want to share that.
@@JaeTLDR1 yes, fair enough, but this particular filter isn’t working that well, to a point it’s distracting.
@@JaeTLDR1 i am not against that, but the filter is very annoying to look at. makes me not want to look at him at all. that i think defeats the purpose of having a cam
who cares lol
Huh. You watching at him all the time? You gey??
Do we really need more front end frameworks ?
There needs to come a point where the community chooses one main thing and just make that better. We don’t need vue, angular, react, blah blah blah. Just everyone focus on react
Ain't gonna happen, more shiny frameworks will emerge and current ones will become rusty in future, that's how js ecosystem "evolves". 🙃
hold your horses react fan boy. competition is healthy and helps products evolve.
This is silly. React is not a one-size-fits-all solution and could never be. Competition is necessary to encourage innovation and cover different use cases.