前端请求一个接口,返回一组数据量相对大的树形数据,慢慢慢~前端或者后端有什么优化方案吗???

leyioliu
  • 11

前端请求一个接口,返回一组数据量相对大的树形数据,慢慢慢~有什么优化方案吗???

回复
阅读 347
4 个回答

当数据确实很多的时候,瓶颈就不是后端优化sql或者优化前端代码的时候了, 因为节点过多实实在在会导致浏览器卡顿,现在的解决方案就是使用虚拟列表,只渲染可见区域的节点,从而控制节点数量,当下拉的时候,也就是可见区域变化时, 再去做一些节点操作( 删除之前的节点, 预加载下一片可见区域的节点等 )

树形处理不就是处理为懒加载吗?
先加载最外层父节点,然后点击那个就去请求那个下面的第一级子节点。
这样前后端都快

http://www.treejs.cn/v3/demo....
ztree

1、大数据量加载说明
1)、zTree v3.x 针对大数据量一次性加载进行了更深入的优化,实现了延迟加载功能,即不展开的节点不创建子节点的 DOM。
2)、对于每级节点最多一百左右,但总节点数几千甚至几万,且不是全部展开的数据,一次性加载的效果最明显,速度非常快。
3)、对于某一级节点数就多达几千的情况 延迟加载无效,这种情况建议考虑分页异步加载。
4)、对于全部节点都展开显示的情况,延迟加载无效,这种情况建议不要全部展开。
5)、显示 checkbox / radio 会造成一定程度的性能下降。
6)、利用 addDiyDom 功能增加自定义控件会影响速度,影响程度受节点数量而定。
7)、利用 onNodeCreated 事件回调函数对节点 DOM 进行操作会影响速度,影响程度受节点数量而定。
2、setting 配置信息说明
不需要进行特殊的配置
3、treeNode 节点数据说明
对 节点数据 没有特殊要求,用户可以根据自己的需求添加自定义属性

你要优化,必须先找到瓶颈,从你的信息中是不知道瓶颈在哪里的。
可能的瓶颈

  1. 后端数据生成中
  2. 传输
  3. 前端处理中

它们优化的策略和手段是不一样的。

但一个可能通用的原则就是,减少加载处理量,比如上面提到的懒加载,或者分段、分类加载

你知道吗?

宣传栏