1.编译时Vdom的diff算法****性能优化
patchFlag
假设有3个
标签其中一个是使用动态渲染的在v3之前
如果msg的值发生改变则整个模板当中的元素都会去重新渲染，这在少量标签的情况下不会产生很大的影响但是如果模板中有大量的标签这将会产生大量不必要的检查
在V3当中
在模板编译时，编译器会在动态的节点后加上/* Text */ PatchFlag。只有带有PatchFlag的元素才会被认为是动态元素，会被追踪属性的修改
每一个Block中的节点，就算很深，也是直接跟Block一层绑定的，可以直接跳转到动态节点而不需要逐个逐层遍历。
既有VDOM的灵活性，又有性能保证。
\
hoistStatic 静态节点提升
当使用hoistStatic时，所有 静态的节点都被提升到render方法之外。这意味着，他们只会在应用启动的时候被创建一次，而后随着每次的渲染被不停的复用。
\
cacheHandler 事件监听缓存
正常情况下，当绑定一个事件：
<div> <p @click="handleClick">静态代码</p></div>
\
模版会被编译为
export function render(_ctx, _cache) { return (_openBlock(), _createBlock("div", null, [ _createVNode("p", { onClick: _ctx.handleClick }, "静态代码", 8 /* PROPS */, ["onClick"]) ]))}
其中事件会每次从全局上下文中获取。而当开启了cacheHandler之后
export function render(_ctx, _cache) { return (_openBlock(), _createBlock("div", null, [ _createVNode("p", { onClick: _cache[1] || (_cache[1] = ($event, ...args) => (_ctx.handleClick($event, ...args))) }, "静态代码") ]))}
编辑器会为你动态创建一个内联函数，内联函数里面再去饮用当前组件上最新的handler。之后编辑器会将内联函数缓存。每次重新渲染时如果事件处理器没有变，就会使用缓存中的事件处理而不会重新获取事件处理器。这个节点就可以被看作是一个静态的节点。这种优化更大的作用在于当其作用域组件时，之前每次重新渲染都会导致组件的重新渲染，在通过handler缓存之后，不会导致组件的重新渲染了。
\
SSR 服务端渲染
什么是SSR
可以将同一个组件渲染为服务器端的 HTML 字符串，将它们直接发送到浏览器，最后将这些静态标记"激活"为客户端上完全可交互的应用程序
简单点说：就是将页面在服务端渲染完成后在客户端直接显示。无需等待所有的 JavaScript 都完成下载并执行，才显示服务器渲染的标记，所以你的用户将会更快速地看到完整渲染的页面。
SSR原理
1）所有的文件都有一个公共的入口文件app.js
2）进入ServerEntry（服务端入口）与clientEntry（客户端入口）
3）经过webpack打包生成ServerBundle（供服务端SSR使用，一个json文件）与ClientBundle（给浏览器用，和纯Vue前端项目Bundle类似）
4）当请求页面的时候，node中ServerBundle会生成html界面，通过ClientBundle混合到html页面中
