There are many types of performance optimization in vue, because if you change many places carefully, you can reduce the code and complete the performance optimization.
1. Source code optimization
1. Code componentization
That is, some reusable codes and some reusable functions can be encapsulated into components and introduced where they are used.
2. For loop to set the key value
When using v-for for data traversal rendering, set a unique key value for each item. In order to allow the core code of Vue to find the data faster, when the old value is compared with the new value, you can Faster positioning to diff.
3. Vue routing is set to lazy loading
When the first screen is rendered, it can speed up the rendering.
5. You can use keep-alive
Keep-alive is a relatively abstract component provided by Vue, which is used to cache components to save performance.
The second is packaging optimization
1. Introduced plugins
In order to facilitate the use of simple frameworks in the coding process, we use each of these frameworks to introduce on demand to reduce performance consumption.
2. Reduce the use of pictures
Because for a web page, pictures will take up a large part of the volume, so the operation of optimizing pictures can effectively speed up the loading speed. You can use some css3 effects to replace the picture effects, or use Sprite to reduce the size of the picture.