BT

InfoQ Homepage News State of the Vuenion 2021 - Evan You at Vue Amsterdam 2021

State of the Vuenion 2021 - Evan You at Vue Amsterdam 2021

Bookmarks

Evan You, creator of the Vue.js front-end framework, recently presented at the Vue Amsterdam 2021 conference the latest and future Vue developments.

You emphasized that Vue 3 was a huge release to which parts of the Vue ecosystem are currently adjusting to. Vue Router 4 and VueX 4 are now stable and support Vue 3. Other parts of the ecosystem (e.g., Nuxt, Vuetify, Quasar, Element Plus, Ant Design Vue are catching up).

Future developments in terms of development experience revolve around three axes: build tools, authoring experience, and IDE support. While Vue can be used as a drop-in runtime library, You sees Vue as a framework that is supposed to provide a cohesive and comprehensive development experience. You explained:

I am a Vue user as well; and every time I’m trying to spin up a Webpack-based Vue project, I have to go through the process of installing hundreds of megabytes of dependencies and then having to wait several seconds for a project to start up. […] I really miss the days where I could just open up an index.html, drop some code in it, and see it instantly start up, see it instantly reflect any changes I make.
[…] It seems to me the [that the] only logical conclusion is to figure out how to make things fast.

The Vite build tool, which is now framework-agnostic, is Vue’s attempt to deliver a fast build tool to Vue developers. Vite has taken some ideas from coincidental developments like Snowpack or WMR, and uses the ES modules support provided by modern browsers to speed up feedback loops in development. You said:

There are integrations — if you are primarily working with back-end frameworks like Rails or Laravel. There are already tools that allow you to use Vite in there, but you can also use Vite as a standalone Vue CLI equivalent for building SPAs [Single-Page Applications].
[…]
From my personal experience, some apps that would require more than 30 seconds to start with Webpack or Rollup […] now typically start within one or two seconds with a Vite-based setup. I believe this kind of speed improvement is so significant that it is worth rethinking how the whole tooling landscape should work.

In the short-term, Vite and the Vue CLI should co-exist, with a view to having them converge in the long term.

You further described ongoing experiments to improve the authoring experience. The <script setup > RFC experiments with a new script type in Vue’s single-file components that provides a more concise syntax for the setup function introduced in Vue 3’s Composition API. Another RFC lets developers declaratively describe stateful styles, with the compiled component leveraging CSS variables. The ref sugar RFC seeks to simplify the syntax of declaring and using reactive data (declared with the ref function in Vue 3’s composition API). The Vue developer community has been providing its comments to the ongoing RFCs.

In terms of IDE support, You emphasized that an increased number of users are expecting comprehensive type checking, code intelligence, and refactoring support in single-file component templates. Currently, Vetur, VueDX, and Volar are providing IDE support. You thinks that it is time to gather the results of these explorations in a single tool:

The problem is that the user experience right now can be a bit fragmented and confusing. If you’re starting a new project now, you have to decide which extension to use; or whether to go with the Visual Studio Code extension path; or go with the TypeScript plugin path; and how to get the best of all of these tools together without having to configure them individually.
Now I believe it’s time for us to sort of consolidate these efforts […] and present an official solution.

You estimated that six months after the release, around 8% of Vue apps are using Vue 3. You speculated that Vue 3 adoption may be slowed as users are waiting on parts of the ecosystem to support the new version. A better migration path and legacy browser support (IE11) may also help further adoption. You announced:

The next big focus [in the first half of 2021] will be the migration between Vue 2 and Vue 3. We want to figure out what’s the best way for people to migrate, or figure out what’s the best way to get the benefits of Vue 3 maybe without migration. [We also] want to figure out what’s the best way to keep the whole framework ecosystem moving forward with the given fact that Vue 2 is here to stay and the two major versions will coexist.

While the previously mentioned factors may have slowed down the adoption of Vue 3, it is also possible that Vue 3’s new features are not attractive enough or can be somewhat replicated in Vue 2. One developer detailed several ways to replicate or replace Vue 3's new features with Vue 2’s in an article titled Yes, Vue 3 is out but you probably don’t need it.

The Vue team also ambitions to provide better code reuse between Vue 2 and Vue 3, identify best practices for authoring libraries that work across versions, and rethink legacy browser support.

Vue.js Amsterdam is a yearly conference targeted at Vue developers with talks addressing the latest technologies and trends in software development.

We need your feedback

How might we improve InfoQ for you

Thank you for being an InfoQ reader.

Each year, we seek feedback from our readers to help us improve InfoQ. Would you mind spending 2 minutes to share your feedback in our short survey? Your feedback will directly help us continually evolve how we support you.

Take the Survey

Rate this Article

Adoption
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

BT

Is your profile up-to-date? Please take a moment to review and update.

Note: If updating/changing your email, a validation request will be sent

Company name:
Company role:
Company size:
Country/Zone:
State/Province/Region:
You will be sent an email to validate the new email address. This pop-up will close itself in a few moments.