命令式与声明式
- 命令式注重过程 获取div-设置文本内容-绑定点击事件
- 声明式注重结果 ,类似于告诉框架我要实现一个div，文本是hello word 还有个绑定事件，至于怎么实现，由vue帮我们封装了过程
<div @click="() => alert('ok')">hello word<div>
vue内部实现是命令式，暴露给用户是声明式
性能与可维护性
性能
- 命令式性能优于声明式
- 声明式代码更新，需要找出差异，再进行修改
- 命令式代码更新，由于明确知道哪发生了更新，直接进行修改
可维护性
- 声明式可维护性优于命令式
- 声明式只需维护结果，至于过程交给vue
- 命令式需维护整个过程，手动完成DOM的创建、更新、删除 在保持可维护性同时让性能损耗最小
虚拟DOM的性能
- 虚拟DOM是为最小化找出差异而出现的
innerHTML与虚拟DOM的性能比较
创建
- innerHTML，渲染HTML字符串+创建所有的DOM元素
- 虚拟DOM，创建javascript对象+创建所有DOM元素
创建阶段没有较大的差异，都需要新建所有的DOM元素
更新
- 虚拟DOM与数据变化有关，innerHTML与模板大小有关
innerHTML,虚拟DOM，原生JavaScript
- 心智负担：创建、删除、修改DOM元素 结合心智负担、可维护性等因素，vue使用虚拟DOM。
运行时和编译时
- 运行时 用户提供树形结构，框架向外暴露render函数
- 编译时+运行时 用户提供html模板 框架向外暴露compiler（将html模板转化为树形结构的数据对象），render函数
- 编译时 将HTML字符串编译成命令式代码
纯运行时无法分析用户提供的内容，编译时可以分析用户提供的内容，分析哪些内容未来可能发生变化，哪些内容永远不会发生变化，然后传递给render函数进一步进行优化。纯编译时，直接编译成JavaScript代码，性能会更好，但灵活性差，即用户提供的内容必须编译后才能用 vue3使用编译时+运行时框架，在保持灵活性的基础上，通过编译手段分析用户提供的内容，从而进一步提升更新性能
