js渲染带查询 树（13万条数据） 性能优化有什么可行方案

Question

老哥们，现在有个需求，大概有十三万条树结构数据，要渲染在前端，一波给的，前端自己做搜索，有啥方案没有

Answer 1

拿到数据之后worker做计算，渲染使用虚拟滚动条展示最近的几十条数据即可

Answer 2

前端拿到数据后，最好还是按节点进行加载。这是比较简单的方案。还有一种方案可以参考recycler-view的思路，不过在树的渲染上实现有些复杂。

Answer 3

这尼玛，13万，怎么想的。接口一般不应该是只给可见的那部分，或者稍微多一点。

Answer 4

思路: worker线程处理数据，自己把数据做成一个本地数据库，使用二分法或者动态规划算法做查询，返回数据做分页处理，一页10-50条即可.

Answer 5

13万数据应该还没达到js处理瓶颈。
但是渲染会卡，所以应该做动态渲染。
如果是Vue的话，不要使用递归组件，而是将树转为列表进行渲染。
一个例子：
https://github.com/Lushenggan...

Answer 6

显示用rc-tree，反正有虚拟滚动，搜索就空间换时间，估计内存也就占30M，小意思了，如果是行政区划这种有父子规律的话还能优化优化

Answer 7

这个一般是根据需要，局部动态渲染，只处理能看见附近的，不会整体渲染的，因为渲染出来也是看不见的。