前人栽树，后人乘凉，ETAF 的开发离不开下面的技术支持。

• CSS 选择器: 提供 ETML 节点选择功能，为复杂样式更新提供强大功能。
• dom.el: Emacs 内置的 dom.el 提供文档树操作能力，API 简洁好用。
• tailwindcss: 提供一种现代化的 CSS 使用方式，解决了手写 CSS 的烦恼。
• Life of a Pixel: 谷歌工程师 Steve Kobes 的演示，深入讲解了浏览器将代码转换为屏幕上像素的完整流水线。
• 原生 HTML/CSS/JS 渲染测试: https://developer.mozilla.org/en-US/play

DOM 树 Node 节点

• https://chatgpt.com/c/692d9856-3dd4-832f-8520-93912d99b79e
• 浏览器内部 Node 抽象
  • parentNode: Node*
  • firstChild: Node*
  • nextSibling: Node*
  • nodeType / nodeName
  • attributes (Element 专有)
  • eventListeners (事件系统的监听器存储)
  • style: CSSStyleDeclaration (行内样式)
  • computedStyle (渲染树用到的最终计算样式)
  • layoutObject / renderObject (布局树节点)
  • flags（内部标记位：脏标记、挂载标记等）
  • shadowRoot / customElementHooks（如果有）
  • other implementation details (很大)

虚拟 DOM

虚拟 DOM 的必要性来自：声明式 UI 需要一个“中间表示层”（UI 的数据模型），框架必须在这个表示层上运行 diff 算法去计算 UI 如何更新；而虚拟 DOM就是这个“中间表示层”的实现方式之一。声明式 UI 需要一个“可计算的 UI 状态模型”，框架必须根据这个模型来判断如何最小代价更新 DOM。虚拟 DOM 就是这个“可计算模型”的一种实现方式。

• vue3 渲染机制: https://cn.vuejs.org/guide/extras/rendering-mechanism
• Vue 3 Template Explorer: https://template-explorer.vuejs.org/#eyJzcmMiOiI8ZGl2PkhlbGxvIFdvcmxkPC9kaXY+Iiwib3B0aW9ucyI6e319