Vue 3.0 officially released, this release of all the summaries, let's see!

The article comes from the public number: Frontman Author: Ghost Brother

On September 18, 2020, Vue.js 3.0 was officially released. The release framework itself brings several big improvements, as well as some summaries of features and journeys!

1.Vue 3.0 History

• Version 3.0 represents more than 2 years of development
• Has more than 30 RFCs
• More than 2,600 submissions
• From 99 contributors
• 628 pull requests
• A lot of development and documentation work

2. Vue's mission

Become an easy-to-reach framework for anyone to learn quickly

3. Performance optimization

• Route lazy loading
• Keep-alive caches the page
• Use v-show to reuse DOMs
• v-for traversal avoids using v-if at the same time
• Long list performance optimization
• The destruction of the event
• The picture is lazy to load
• Third-party plug-ins are introduced on demand
• Stateless components are marked as functional components
• Subcommution splits
• The variable is localized
• SSR

4. Better TypeScript integration

• Improved TypeScript support, editor provides powerful type checks and errors and warnings
• Better debugging support

5. New API for handling large-scale use cases

• reactive
• ref
• computed
• readonly
• watchEffect
• watch
• unref
• toRef
• toRefs
• isRef
• isProxy
• isReactive
• isReadonly
• customRef
• markRaw
• shallowReactive
• shallowReadonly
• shallowRef
• toRaw

6. Layer internal modules

The Vue 3.0 kernel can still be used with a simple '' label, but its internal structure has been completely rewritten as a set of decoupled modules. The new architecture provides better maintainability and allows end users to shake trees to reduce runtime size by half.

The modules are as follows:

The module provides function points:

1. Compiler supports custom AST conversions for build-time customization (e.g., build-time i18n)

2. The core runtime provides API for creating custom renderers for different rendering targets, such as native 本机移动设备 WebGL or 终端 The default DOM renderer is built using the same API.

3. The features exported by the @vue/reactivity module have direct access to Vue reaction system and can be used as a stand-alone package. It can be paired with other template solutions, such as lit-html and can even be used in non-UI scenarios.

7.the purpose of the design of the create-api

Designed to address the difficulties that Vue uses in large applications. The Composition API is built on a reactive API that enables logical composition and reuse similar to React hooks, more flexible code organization patterns, and more reliable type inference than the 2.x object-based API.

8. Performance improvement (relative to Vue2)

• By rocking the tree (reduced by up to 41% of the resource size)
• Initial rendering (up to 55% faster)
• Update speed: (up 133% faster)
• Memory footprint: (up to 54% reduction)

9. Two experimental features are available

Grammar sugar used to use the Composition API in the SFC

State-driven CSS variables in SFC

Migration 3.0 guide

10. Compatible with IE11

They are planned to be focused in the fourth quarter of 2020. Therefore, users planning to migrate existing v2 applications or who need IE11 support should be aware of these limitations at this time.

11. Follow-up plan

• The migrated version
• IE11 support
• Router and Vuex integration in the new devtools
• Further improvements in template type inference in Vetur

Link to new document:

• New official website: v3.vuejs.org/
• Official introduction: github.com/vuejs/vue-next/releases/tag/v3.0.0
• Migration guide: v3.vuejs.org/guide/migration/introduction.html
• Composition API : v3.vuejs.org/guide/composition-api-introduction.html

Above is W3Cschool编程狮 about Vue 3.0 official release, this release of all the summary, let's see! Related to the introduction, I hope to help you.