Why is Vue3.0 so fast?

I also read other people's articles and wrote them.
Some people wrote them well. Why am I still writing them myself? Only after writing them myself can I remember them more clearly

Changes to the diff algorithm

在这先解释一下什么是Diff算法；		
	diff算法是通过循环递归对节点进行比较，比较出节点状态和需要的操作，最后使用vnode进行DOM渲染，
	在次过程中会有俩个DOM树，一个第一次渲染的，一个更新后的渲染的。

1. When using the diff algorithm in vue2.0, all nodes will be rendered. Regardless of whether it is a hard-coded div or needs to be changed, it will be re-rendered. 2.
When vue3.0 is rendered, a static mark will be added according to whether there is a need for the change when rendering the Dom.

The drawing is rather ugly, just look at it

hoistStatic static hoist

1. In vue2.0, when updating the Dom, it will be fully updated and recreated. consumes performance
2. In vue3.0, elements that are not updated will only be created once, and will be reused in each subsequent rendering, such as the hard-coded div in the above picture

cacheHandlers event listener cache

1. The previous Onclick will be regarded as dynamic binding, and the change of dynamic binding will be tracked every time, but it is the same function, just reuse it directly

ssr rendering

1. When there is a lot of static content, it will be purely in the form of a string in the buffer. Even if there is a dynamically changing content, you can also use the template interpolation method, which is faster than the virtual DOM.
2. When the static content reaches a certain level, the _createStaticVNode method will be used to generate a static on the client. These static nodes will be directly innerHtml, so there is no need to create objects, and then render according to the objects, which means that there is no need to go through the process of virtual dom.

Reference address https://blog.csdn.net/shadowfall/article/details/112385269