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 },
             } }
            };

关闭蝙蝠，平面格式似乎更容易在眼睛上，但服务器将生成该列表，所以老实说，这不是一个大问题。性能如何比较？使用flat时，需要进行更多DOM次查找，即找到id=1的元素并为DOM插入id=2元素。结构化格式定义了所有关系，以便javascript代码导航结构，它可以创建所需的所有DOM元素而无需额外的查找。那么哪种方法通常会更高效？

Answer 1

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

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

1 个答案: