当前位置: 首页 > Web前端 > HTML

前端BUG记录——数组排序导致的卡顿_0

时间:2023-04-02 15:15:35 HTML

前端BUG记录——lodashjsdebouncedebounce优化导致的BUG这两个BUG其实是同一个BUG,怎么说呢?两者都对,错误的是同时使用它们。因为我没有处理边界,所以会排序一个大数组,造成了卡顿。然后滞后导致省时,成了笑话。提问因为这个BUG其实有几个限制条件触发,所以先问几个问题。对5000个乱序数据进行排序需要多长时间?Array.prototype.sort5000条有序数据,排序需要多长时间?Array.prototype.sort对于有序数据,什么样的算法合适?对于无序数据,什么样的算法合适?Array.prototype.sort使用什么算法?你对这些灵魂折磨有答案吗?我现在的场景是分页拉取数据,有序展示。如果你有答案,你就知道排序不是很适合我的场景,插入排序应该是最好的选择。Array.prototype.sort测试地址:https://www.lilnong.top/static/html/user-session-list-virtual-insertsort-log-2.htmlArray.prototype.shuffle=function(){letarray=this;让len=array.length;对于(leti=len-1;i>0;i--){letj=Math.floor(Math.random()*(i+1));[数组[i],数组[j]]=[数组[j],数组[i]];}}vm.list.shuffle();console.time('a')vm.list.sort((n,m)=>n.id-m.id);console.timeEnd('a')console.time('b')vm.list。排序((n,m)=>n.id-m.id);控制台。timeEnd('b')console.time('c')vm.list.sort((n,m)=>n.id-m.id);console.timeEnd('c')我遇到的问题&解决方案Array.prototype.sort代码已升级。事实上,它运行在一个新的浏览器中。我的方案也可以通过,耗时不到10ms。但是由于我们是PC客户端,需要兼容XP系统,所以Chrome的版本极低(40多)。新版本实际上使用了timsort,这是一种混合了插入排序、归并排序、二分查找等算法的工业级算法。亮点是充分利用了待排序数据可能部分有序的特点,根据待排序数据的内容动态改变排序策略——选择性合并和奔跑。什么是Timsort排序方式?所以这里我们可以把sort改成timsort。只需要一种插入排序https://www.lilnong.top/static/html/user-session-list-virtual-insertsort-log-2.html由于我的数据是有序的,所以插入排序可以更快。我是靠lodash的_.sortedIndexBy来实现的,因为还有toprules,所以提供了计算权重的方法