DOM操作和Javascript数据结构：平面还是结构化？

Question

我有一个业务需求（这是不会改变）在页面上显示约10,000个项目（我不喜欢它）。这些项目通过父子关系相关，就像磁盘驱动器上的文件夹，子文件夹和文件一样。

我想构建页面的方式是由javascript数据结构驱动（内部应用程序，javascript将始终启用）。

通常情况下，如果每个记录都包含指向其父级的链接，那么通常会有更好的结构化数据结构，其中每个“文件夹”包含对“子文件夹”和“文件”的引用“？

即：

var items = { //flat array 
       {id:1, parentId:0}, 
       {id:2, parentId:1}, 
       {id:3, parentId:1}, 
       {id:4, parentId:2}, 
       {id:5, parentId:2} 
      }; 

var items = { //structured 
      { id: 1, children: { 
       { id: 2, children: { 
       { id: 4 }, 
       { id: 5 }, 
       } }, 
       { id: 3 }, 
      } } 
      }; 

蝙蝠平格式似乎对眼睛更容易，但服务器会生成列表，以诚实，是不是这样的一个大问题。性能如何比较？随着平坦，将需要更多DOM查找，即查找元素id=1和插入DOM元素为id=2。结构化格式具有所有定义的关系，因此javascript代码正在导航结构，它可以创建所有需要的元素而无需其他查找。那么，哪种方法通常会更高效？

Answer 1

结构化。它具有更高的可伸缩性，并且可以更容易地使用JQuery来操作DOM中的节点。