Ⅰ. Why learn vue3?
For the type, if it is true, it is not bad to use React, it is nothing more than poor performance~~
This sentence of the author indirectly shows: the compatibility of vue3 with ts is better than that of react . The
main point is simplicity and fast development speed!!! ( Or the company will use it)
Ⅱ. How does vue3 become faster?
| introduce | view3.0 | view2.0 |
|---|---|---|
| Two-way binding optimization | Vue3 uses ES6 proxy to proxy (reference data type) [removes the traversal time of an Object.keys()] Details: Click here |
Vue2 uses Object.defineProperty() [Object.keys() needs to be performed on the property, so it must be registered in the data function] |
| Diff algorithm optimization | vue3 only compares labels that may change (statically marked) | Full comparison of virtual dom of vue2 (time-consuming) |
| static lift | DOM elements that do not need to be updated will be statically promoted only once | - |
| … | … |
Ⅱ. Essentials for getting started
| Necessary to enter the pit | Details (and comparison with vue2) |
|---|---|
| Api modularity | Import what is needed, such as: import { onMounted } from 'vue' |
| vue3 component communication | Click here |
| vue3 data response | Click here |
| vue3 hook function | Click here |
| watch and computed | Click here |
| vue3 routing changes | Click here |
| vue3 uses vuex | Click here |
Ⅳ. Advanced Outline
| Advanced must | Details |
|---|---|
| The use of pinia (vuex5.0 concept) | Click here |
| Recursive application of vue3 components (package components) | Click here |
| vue3 common API | pending upgrade |
| Vue3 adds other APIs | pending upgrade |
| vue3 non-recursive listening (performance optimization) | pending upgrade |
| . . . | . . . |