vue3为何向Inferno与ivi靠拢
Author：zhoulujun Date：
在《diff算法：react与vuediff算法对比，snabbdom.js 》一文中，提到过
vue2的核心Diff算法采用了双端比较的算法，同时从新旧children的两端开始进行比较，借助key值找到可复用的节点，再进行相关操作。相比React的Diff算法，同样情况下可以减少移动节点次数，减少不必要的性能损耗，更加的优雅
从《浅谈 React/Vue/Inferno 在 DOM Diff 算法上的异同》，简单阐述了 React、Vue、Inferno 的算法梗概
React 假定最大递增子序列从0开始，在末尾节点移动到首位的场景中会恶化；
Vue 利用双向遍历排序的方法，有可能不是最优解，但与最优解十分逼近；
Inferno 利用最大递增子序列的算法达到了移动DOM次数最少的目标；
三种算法对于倒序这种场景都降级为理论上的最少N-1次。
Vue3.x借鉴了 ivi算法和 inferno算法。
虽然 Vue.js 并没有直接使用 ivi 或 Inferno 框架的代码，但是它确实从这些项目的设计理念中汲取了一些灵感。
比如Vue 3.x 借鉴 ivi 和 inferno 算法的思想，在渲染器的 diff 算法上进行了重要优化。这些优化措施包括 VNode 类型确定、位运算判断以及动态规划思想的运用等，它们共同作用于 Vue 3.x 的渲染流程中，使得 Vue 3.x 在性能上相比 Vue 2.x 有了显著提升。
Vue 3.x 从 Inferno 中获得的一些灵感包括：
虚拟 DOM (vDOM) 的高效实现：Inferno 使用高效的 vDOM 实现，减少内存使用并提高渲染速度。Vue 3.x 同样优化了它的 vDOM 实现，采用了更细粒度的 patching 策略，并且通过 Tree Shake 友好的 API 设计使得打包体积更小。
函数式组件：Inferno 鼓励使用函数式组件而非类组件。Vue 3.x 支持函数式组件，并且在 Vue 3 中函数式组件可以更好地与 Composition API 结合使用。
Vue 3.x 可能从 ivi 的某些想法中得到了启示，比如：
直接 DOM 操作：尽管 Vue 3.x 仍然使用 vDOM，但它对 vDOM 的处理更加智能，例如在更新过程中尽可能地复用现有的 DOM 节点而不是重新创建它们。
可预测性：ivi 强调可预测性和调试性，Vue 3.x 在其开发者工具中也加强了这些方面，使得开发者更容易理解和调试应用的状态变化。
ivi算法和inferno算法的特点
ivi算法：ivi算法通过在创建VNode时就确定其类型，以及在mount/patch的过程中采用位运算来判断一个VNode的类型，从而优化了虚拟DOM的创建和更新过程
inferno算法：inferno算法同样关注于优化虚拟DOM的创建和更新，通过位运算和核心的Diff算法，提高了Vue3.x的性能
那么Inferno 与ivix 到底是何方神圣呢？
Inferno
Inferno类似于React的库，最大的卖点却是其卓越的算法。
与Preact相似，Inferno也使用与React相同的API构建，但是Inferno的主要目的是变得快速、轻便。
尽管Inferno基于React，但与React 和Preact相比，它包含一些重要的功能/差异：
与React相比，Inferno的体积非常小。压缩后约为8KB，比Preact稍大。
Inferno不单独包含DOM。Inferno的DOM内置于其核心中。
Inferno-compact可以帮助您使用各种React库。
Inferno在功能组件上使用生命周期方法。
Inferno和典型的虚拟DOM库不同，比如React、Mithril、Cycle和Om等，Inferno采用了智能技术来区分静态和动态的内容，这让Inferno仅仅“区分”渲染那些有动态值的内容。
Ivi
Ivi 是一个轻量级且高效的前端UI框架，https://github.com/localvoid/ivi
他的设计哲学是简洁、灵活和可扩展，使得开发者能够在项目中轻松集成各种自定义组件和第三方库。
其实这个个人还是不太感冒这个
转载本站文章《vue3为何向Inferno与ivi靠拢》,
请注明出处：https://www.zhoulujun.cn/html/webfront/engineer/Architecture/9258.html