Vue 3 – A roundup of infos about the new version of Vue.js

By now you're probably aware we're getting a shiny new version of Vue. Evan you announced it back in Fall 2018 at Vue.js London – here's his slide deck about Vue 3.0 Updates. His announcement summary was also published on the official Vue.js blog.

Until the release of Vue 3, we want to collect all valuable infos and resources in this article for you, so you'll be up-to-date.

Vue 3 release date

There's no official release date, but the roadmap shows the official release is planned in Q1 2020. The new version is currently open-sourced in alpha stage (v3 - See the changelog here!).

You can of course already experiment with it, especially to help identify bugs that you discover while building demo apps (report them through the Vue Issue Helper!). Keep in mind that it's still an alpha, but go and have fun with it!

To make it easier for you to start experimenting, there's now a Vue CLI plugin for the next-release!

The new alpha release of Vuex 4 is also Vue 3 compatible, while providing the same API as Vuex 3.

Vue 3 features & changes

As Evan You summarized it, Vue 3 will be faster, smaller, more maintainable and it will be easier to target native.

Composition API

One of the most significant changes is that a new API that will allow for a function-based way of writing your component, inspired by React Hooks. It lets you encapsulate logic into "composition functions" and reuse that logic across components. Read the whole Request for Comments (RFC) for more info about the proposal or look into the API reference. (The API has been renamed from "Functions API" to "Composition API" along the way, so don't let that confuse you!)

Yes, that changes the way how we use Vue. However, it won't break anything in your Vue 2.x apps, as the new API is 100% compatible with the current syntax, which won't be deprecated any time soon.

Personally, we think that this change will bring us a lot of flexibility, and lead to better structured code.

If you want to start experimenting, the new Composition API is available for 2.x as a plugin, and there's an (evolving) API reference.

Other pretty exciting changes in Vue 3:

  • Virtual DOM rewrite for better performance and improved TypeScript support
  • Native portals
  • Fragments (virtual elements that won't be rendered in the DOM tree)
  • Global mounting
  • Conditional suspending of component rendering
  • ... and more.

Learning Vue 3

There are already talks and articles available where you can learn more about new functionality. Take these with a grain of salt, as the new version is obviously still evolving.

Vueschool is also updating their Master Class course for Vue.js 3. It's not yet available as of now, but you can leave your email to be notified when they launch. If you're a bit nervous about how version 3 will impact you, this course is a great way to combat that for sure.

Should you start learning Vue now or wait for v3?

If you're just starting out with Vue, don't hesitate to start learning with v2. Most key concepts of the framework stay the same, and your knowledge will still be valuable when v3 comes out.

Many of the changes of v3 are internal, like them rewriting the virtual DOM implementation and writing the codebase in TypeScript. This will make Vue faster, but you won't have to use TypeScript if you don't want to.

Knowing that the Vue team is awesome when it comes to documentation, we're sure you won't have any troubles adapting to any new syntax either.

Vue 3 drama

What would be change without a little drama?

There has been a heated discussion within the community (f.ex. on HackerNews and on Reddit) when the RFC for the Composition API was first released in June 2019.

Community members got a bit agitated (and sometimes rude, sadly) – mainly because it was a bit unclear at first whether the new Composition API will be purely additive (which it will be!), or if the current API will be deprecated (which it won't be!). Also, people were afraid that all the time they spent learning Vue was wasted (which it wasn't!).

In case you are still a bit apprehensive about version 3 because of some negative comments, we wanted to collect some articles explaining why you shouldn't be:

Framework changes can be stressful. But we are convinced that the changes in v3 will be a huge step forward, and you'll have enough time to adapt.

Similar Articles
Server-Side Rendering With Laravel & Vue.js 2.5 [via Antony Gore]
10.04.2018  •  in #Bookmarks
In case you didn't notice before: Laravel is kinda my jam! So I was excited for Server-Side-Rendering being supported for Laravel since last year / Vue.js 2.5 😊 If you need to jump into SSR with Vue.js & Laravel, I recommend Anthony Gore's article...
Renderless Components in Vue.js [via Adam Wathan]
08.04.2018  •  in #Tutorial, #Bookmarks
On his blog, Adam Wathan explains how to create your Components in a way that lets you still easily customize their styling.