当前位置: 首页 > 知识库问答 >
问题:

加速ElementUI表格排序的纯前端解决方案?

虞滨海
2024-02-01

我用elementui写了一个表格但是没有分页,所以导致排序速度特别慢,这种有什么特殊的处理方法嘛,纯前端解决?

怎么能优化一下速度

共有1个答案

屈星腾
2024-02-01

分块排序,虚拟化。

建议你看一下排序的耗时,有可能大头其实是 dom 损耗


说一下我的思路哈,为什么这里不用全排序,因为你需要的其实是 TopN。而且你可以预先把几种结果都求出来。

而且前端有 indexDB 之类东西,可以模拟数据库的操作,所以你可以前端自己分页。

排序其实会很快,几万条数据也就几十ms。

但是几万个dom的更新操作,浏览器卡的就太正常了,解决办法就是虚拟化

 类似资料:
  • 本文向大家介绍jQuery实现的表格前端排序功能示例,包括了jQuery实现的表格前端排序功能示例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery实现的表格前端排序功能。分享给大家供大家参考,具体如下: 表格前端按列排序 依赖jQuery(本例使用jQuery-1.8.2) 1.初始化方法 2.页面函数 3.DOM结构 更多关于jQuery相关内容感兴趣的读者可查看本站专题:《

  • 本文向大家介绍Bootstrap Table表格一直加载(load)不了数据的快速解决方法,包括了Bootstrap Table表格一直加载(load)不了数据的快速解决方法的使用技巧和注意事项,需要的朋友参考一下 bootstrap-table是一个基于Bootstrap风格的强大的表格插件神器,官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/

  • 1.项目是使用的若依的框架,vue2+elementui. 2.页面问题:在页面出示加载的时候,会有一个js特别慢,能有10M,加载8s,严重影响页面的体验. 在测试环境还行,但是升级到正式的环境之后就会出现这个问题。 排查之后发现js也是开启gzip的webpack配置 3.webpack的配置 1,删除一些预加载,放在了webpack中,但是不生效。 2,"report": "vue-cli-

  • 我想在cassandra 1.2 CQL 3.0上实现一个实时的内容排名系统 示例:根据用户投票提供新闻的前10条评论 用户可以评论新闻 用户可以对每条评论投票+1或-1 “真实例子youtube评论” 我的解决方案是: 在计数器表(content_counter)上存储投票计数器 创建排名表 null 选择core FROM content_counter where content_id='x

  • 我很难理解quicksort,大多数演示和解释都忽略了实际发生的事情(例如http://me.dt.in.th/page/quicksort/)。 维基百科说: 从数组中选择一个称为透视的元素。分区:对数组重新排序,使所有值小于pivot的元素都在pivot之前,而所有值大于pivot的元素都在pivot之后(相等的值可以从任何一个方向走)。分区后,枢轴处于其最终位置。这称为分区操作。将上述步骤递

  • 本文向大家介绍JS排序之快速排序详解,包括了JS排序之快速排序详解的使用技巧和注意事项,需要的朋友参考一下 本文为大家分享了JS快速排序的具体代码,供大家参考,具体内容如下 说明 时间复杂度指的是一个算法执行所耗费的时间 空间复杂度指运行完一个程序所需内存的大小 稳定指,如果a=b,a在b的前面,排序后a仍然在b的前面 不稳定指,如果a=b,a在b的前面,排序后可能会交换位置 --JS快速排序--