#Programming
So much technology, so little talent. — Vernor Vinge
TOC
Bitmask 位掩码
JavaScript - How is svelte making a component dirty - Stack Overflow
svelte使用$bitmask$技术保存脏检查结果：
component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));- (i / 31) | 0 计算位掩码的索引
- (1 << (i % 31)) 提供位掩码该位的值
- |= 将该位默认位1
- -1 用于表示该组件非脏节点
Diff DOM
Virtual DOM: Back in Block | Million.js
- 静态分析阶段，将树的动态部分提取到 mappings 中;
- 通过脏检查比较数据来确定发生了哪些变化。状态变化则通过mappings更新DOM.
具体步骤
- 不使用React渲染jsx，而是使用million.js，用holes 表示动态变化的部分并传递到虚拟DOM，holes作为动态内容的占位符
- 一旦通过脏检查确定状态变化的内容，即可通过mappings找到各自的节点并直接更新DOM Block Virtual DOM适合的使用场景：
- 静态内容较多。此时可跳过大量静态部分
- 适用于稳定、变化不大的UI树，