This is the 29th day of my participation in the August More Text Challenge

Vue. Js 3.0 doesn’t use the Vue. Js 2.x version of the code, but rewrites it from scratch, writing in TypeScript.

The new VERSION of the API uses all ordinary functions and can enjoy full type inference when writing code.

Vue.js 3.0 has the following 8 highlights.

  1. Better performance

Vue 3.0 rewrites the implementation of the virtual DOM, optimizes the compilation of templates, improves the speed of component initialization, and has significant performance improvements over Vue 2.x in terms of update speed and memory footprint.

  1. The Tree – shaking support

“Prune” useless modules and pack only needed ones, reducing the size of the product release. Vue 3.0 supports on-demand import, while in Vue 2.x, even unused features are packaged.

  1. Combination of AP1 (Composition API)

Vue 2.x uses mixins to reuse features, but the problem with mixns is that if you use them too much, it’s hard to know which mixins a particular feature came from. In addition, mixins have poor type inference. The new Composition API in Vue 3.0 is a perfect replacement for mixins, allowing users to reuse code with more flexibility and no side effects, and the Composition API is good for type inference. Composition API addresses the problem of logical reuse across multiple components.

  1. Debris (Fragmen)

Components in Vue 2X need to have a unique root node. In Vue 3.0, this is a thing of the past. Component templates no longer need a single root node, but can have multiple nodes.

  1. Transfer (Teleport)

Sometimes a part of a component template logically belongs to that component, and from a technical point of view it is best to move that part of the template to a location in the DOM outside of the Vue application, a requirement that can be easily implemented using the Telepot built-in component.

  1. Suspense (Suspense)

Suspense built-in components can wait for nested asynchronous dependencies in a nested hierarchy and support async Setup (), which supports asynchronous components.

  1. Better TypeScript support

Vue 3.0’s code base is written entirely in TypeScript with better type support. Front-end developers can now develop Vue applications in TypeScript without worrying about compatibility, combined with the Vue 3.0 enabled TypeScript plug-ins.

Development is more efficient, and can have type checking, automatic completion and other functions.

  1. Custom renderer API

Using the custom renderer API, users can try to integrate with third-party libraries, such as writing WebGL custom renderers. It should be noted that Vue3.0 does not currently support IE11.