Skip to content

Double Click: Vue 3.2 packs stable features & performance improvements!

Welcome to the Double Click! This is the weekly blog series that shines a spotlight on emerging technologies, technological concepts, and community projects that enrich the JavaScript Ecosystem!

This week, we turn our attention to the wonderful Vue Core Team, who very recently released Vue 3.2.

According to this statement by VueJS creator, Evan You, this release does include significant performance improvements without subjecting devs to any breaking changes.

New features include stable releases for < script setup > and ‘< style > v-bind ’, which both have use when working with Single File Components. According to the official announcement:

“‘< script setup >’ is a compile-time syntactic sugar that greatly improves the ergonomics when using Composition API inside SFCs.”

This feature will feel very familiar for Svelte users as it allows developers to export individual variables or functions, within their script setup, to their templates, instead of entire objects.

'< style > v-bind' enables component state-driven dynamic CSS values in SFC < style > tags.

This ‘< style > v-bind’ feature automatically passes any value defined in the code directly to the CSS as a binding.

The latest release of Vue 3 also allows expanded options for creating web components using the Vue CLI.

To permit this, the team created a new ‘defineCustomElement’ method which gives developers the ability to create and consume custom web components that can be used across the JavaScript ecosystem, using Vue.

Of course, even if developers are not interested in using one of the handful of new features offered with this 3.2 release, there are still a number of reasons to be excited. This release includes a number of performance enhancements, including (from official announcement):

More efficient ref implementation (~260% faster read / ~50% faster write) ~40% faster dependency tracking ~17% less memory usage

So what are you waiting for? Be sure to update to the latest version of Vue 3, and try out these new features yourself!

This Dot Labs is a development consultancy focused on providing staff augmentation, architectural guidance, and consulting to companies.

We help implement and teach modern web best practices with technologies such as React, Angular, Vue, Web Components, GraphQL, Node, and more.

You might also like

VueJS

Making sense of Multiple v-model Bindings in Vue 3

VueJS

Take your App to the Next Level with Vue 3

VueJS

Introducing the release of Vue 3

VueJS

How to Set Up Storybook in VueJS