DirectSurface UIDirectSurface UI
开始使用
文档/性能与调试

大树性能

大树组件的难点不是绘制单个节点,而是展开、折叠、搜索、滚动和选中状态会影响大量节点。

关键策略

  • 只把可见展开路径扁平化。
  • 大量子节点分批展开。
  • 搜索时保留展开状态,不要无意义重建整棵树。
  • 滚动到顶部或底部后阻止滚轮继续冒泡到外层容器。
  • 文本溢出显示省略号,hover 显示完整 tooltip。

分批展开

如果一个节点有几千个子节点,点击展开不应一次性创建所有可视节点。可以按批次加载子节点,先显示一批,再继续异步补充。

expand node
  -> show first batch
  -> schedule next batch
  -> keep UI responsive

选中和滚动

选中节点滚出视窗后,hover 和 click 命中仍必须基于当前滚动偏移。不要使用未扣除 scroll offset 的旧坐标。

复制

调试类树组件应支持复制当前节点路径和值。数组路径建议使用 items[0],不要输出 items.0

使用建议

  • 业务树节点要有稳定 key。
  • 展开状态用 key 集合保存,不要依赖节点对象引用。
  • 大树搜索要限制频率,可以 debounce。
  • 节点 label 渲染不要每帧重新分词或测量全文。