Official address: vue3js.cn/docs/zh/

Download source address: github.com/vuejs/vue-n…

Vue3 designed: increment.com/frontend/ma…

Vue3 template compilation: vue-responsive Template-explorer.net lify.app/

New features of VUE3:

Performance improvement:

1. Proxy responsiveness

The responsivity principle is changed from Object.defineProperty to ES6-based Proxy

Advantages: Can avoid Object. DefineProperty problem

  • Deep listening: better performance – it does not recurse to the end but only when it gets to the level
  • Listen for array changes
  • You can listen to add and delete properties

Disadvantages:

  • It is not compatible with all browsers and cannot be polyfill

2. PatchFlag Static flag

  • Dynamic nodes are marked when templates are compiled
  • The diff algorithm only compares the labeled nodes

3. hoistStatic static promotion

  • Promote the static node definition to parent scope and cache it
  • Multiple adjacent static nodes are merged

4. CacheHandle Cache events

  • By default, @click is also marked dynamically
  • Adding cacheHandler will cache events without PatchFlag

Not open cacheHandlerOpen cacheHandler

5. SSR optimization

  • Static node output bypasses VDOM
  • Dynamic node dynamic rendering

6, the tree shaking

  • Different apis are introduced for different situations at compile time, and unused apis are removed

Vue3js. Cn/docs/useful/GUI…

Composition API: Composition API

Composition-api: Better code organization and logic reuse

  • Setup: Entry point to the Composition API
  • Responsive apis: Reactive, REF, computed, Readonly, Watch, watchEffect, etc
  • New life cycle functions :onMounted, onUpdated, onUnmounted, etc
  • Custom function hooks function

Other New features

  • Teleport- Teleports the location of the component
  • Suspense- Load components asynchronously

Better Typescript support

Summary -Vue3 advantages over VUE2?

Vue2’s problems:

  • As functionality grows, the code for complex components becomes difficult to maintain
  • Support for TS is limited

Advantages of VUE3:

  • Better performance
  • A smaller
  • Better TS support
  • Better code organization and logic decoupling

Reference:

Vue 3.0 enterprise project actual combat

Coding.imooc.com/learn/list/…