Paul Krill
Editor at Large

Vue 3.0 arrives, now in TypeScript

news
Sep 22, 20202 mins

Major upgrade brings improvements in initial render speed, update speed, memory usage, and bundle size

Blue Morpho Butterfly
Credit: Dave M. Hunt Photography / Getty Images

Vue 3.0, a major upgrade to the popular JavaScript framework for building web UIs, is now available as a production release, after nearly two years in development. Highlights include better performance and smaller bundle sizes. 

Unveiled September 18, Vue 3.0 improves performance over Vue 2 in terms of render speed, update speed, memory usage, and bundle size. According to the project, initial render is up to 55 percent faster, updates up to 133 percent faster, and memory usage up to 54 percent less. Also, bundle size is up to 41 percent lighter with tree-shaking, a technique used to reduce the output file size.

Vue internals have been rewritten into a collection of decoupled modules, providing an architecture that offers better maintainability and reduced runtime size. Modules expose lower-level APIs that unlock advanced use cases, such as the compiler supporting AST transforms for build-time customizations. The core runtime provides an API for building custom renderers for different targets, such as native mobile, WebGL, or terminals. Also, the @vue/reactivity module exports functions that provide direct access to the Vue reactivity system and that can be used as a standalone package.

The Vue 3.0 release milestone marks the “general readiness” of the framework, although some subprojects may still need work. Vue project developers said it was safe to start greenfield projects on version 3.0. Library authors can upgrade their projects, too.

Other new capabilities in Vue 3.0 include:

  • A Composition API that makes it easier to use Vue in large-scale applications.
  • A codebase written in TypeScript. Type definitions are bundled and up-to-date.
  • Experimental features such as <a href="https://github.com/vuejs/rfcs/blob/sfc-improvements/active-rfcs/0000-sfc-script-setup.md" rel="nofollow"><script setup></a>, which provides syntactic sugar for using Composition inside Single File Components (SFCs), and <a href="https://github.com/vuejs/rfcs/blob/sfc-improvements/active-rfcs/0000-sfc-style-variables.md" rel="nofollow"><style var></a>, which provides state-driven CSS variables inside SFCs.

For the near term, Vue.js builders will focus on migration build capabilities, IE11 support, router and Vuex integration into new tools, and further improvements to template type inference in Vetur tooling.

Paul Krill

Paul Krill is editor at large at InfoWorld. Paul has been covering computer technology as a news and feature reporter for more than 35 years, including 30 years at InfoWorld. He has specialized in coverage of software development tools and technologies since the 1990s, and he continues to lead InfoWorld’s news coverage of software development platforms including Java and .NET and programming languages including JavaScript, TypeScript, PHP, Python, Ruby, Rust, and Go. Long trusted as a reporter who prioritizes accuracy, integrity, and the best interests of readers, Paul is sought out by technology companies and industry organizations who want to reach InfoWorld’s audience of software developers and other information technology professionals. Paul has won a “Best Technology News Coverage” award from IDG.

More from this author