第一章 权衡的艺术
RoleTang 7/28/2022
# 命令式与声明式
命令式 => 关注过程。
比如Jquery框架。我们要实现一个功能，我们会一步一步的去敲代码对它进行实现。比如先获取dom元素，再绑定事件，再实现效果……
声明式 => 关注结果
比如vuejs，我们绑定一个点击事件，直接使用@click进行事件绑定，并不需要关注它是如何绑定的。但其实对于vuejs来说内部实现肯定也是命令式的，但是对于用户来说显然是声明式的。
# 性能权衡
声明式代码性能并不优于命令式代码。
比如对于以下代码：
<html>
<div>
<span>我是span</span>
<div id="dom">
dom
</div>
</div>
</html>
对于命令式代码，我们可以直接使用
dom.textContent = "修改后的内容"
对其进行修改，并且找不到更优的解决办法。
对于声明式框架而言，我们还需要找到需要改动的代码的位置，因为我们不是明确的知道哪儿发生了更改。所以可以这样说。
命令式消耗 = 更新代码的消耗；
声明式消耗 = 更新代码的消耗 + 找出差异的消耗；
# 虚拟dom
虚拟dom其实就是一个描述真实dom的JavaScript对象。它的存在，便是为了减少上述的找出差异的消耗而诞生的。将这一步骤优化至JavaScript算法层面，而不是操作真实的dom层面。
因为框架的设计不仅要考虑框架的可维护性还需要考虑用户的心智负担，原生JavaScript性能固然最优，但没人能保证你能一直写出最优异的代码同时还保证开发速度。
# 框架的运行时和编译时
运行时：直接使用函数进行dom的操作。其实类似vuejs中的render函数。
编译时：比如使用标签形式进行dom的结构的搭建，再将其转换。转换的过程，其实就是编译。
对于vuejs3来说，它就是一个编译时 + 运行时的框架。