自研矢量引擎为什么不选择SVG
问题
一般基于WebGPU开发矢量编辑器时,避免不了要渲染一棵自定义场景树,那么我想为什么不基于现成的SVG开发呢,基础的矢量算法和节点树的维护都是现成的。
核心答案
自定义场景树的开销主要在逻辑层(纯 JS/TS),而 DOM 的开销在浏览器底层(C++ 渲染引擎)。前者完全可控且可优化,后者是黑盒且为通用场景设计。对于专业矢量编辑器,自定义场景树 + WebGPU 的性能上限远超 SVG + DOM。
关键差异总结
| 特性 | DOM | 自定义场景树 |
|---|---|---|
| 控制权 | 浏览器决定 | 完全自主 |
| 更新粒度 | 可能全局重排 | 精确到节点 |
| 数据结构 | 通用+臃肿 | 专用+精简 |
| 空间索引 | 无 | 可自由优化 |
| GPU 交互 | 间接 | 直接 |
| 缓存策略 | 浏览器控制 | 自定义策略 |
