JS处理超长数组时的性能优化（给点建议）

Question

有这样一个实际情况，其实非常简单，就是监听滚轮事件后用定长的区间对某一数组做slice，获取的子串会用canvas去绘制。当然数组实际长度大于6w。现在有遇到较明显的卡顿，尤其是事件触发频次较高的情况，查看了一下performance，似乎问题是出在数组的截取上。不知道各位能不能给点建议：

• web worker? （感觉还是同步的比较好点，之前也没实际尝试过）
• 把长数组截成数段后通过计算找到对应的再去slice？（这个目前正在尝试）
• ArrayBuffer？（听说性能很好...）
• • *

我发现我好像搞错了... 卡顿不是操作数组直接导致的，这是performance:

每次方法调用,js执行时间为1ms，剩下的53ms竟然源自于System自身...
那么问题来了，以上是6W条数据的情况，我把数据减到300条时：

系统自身的延迟仅为2ms
也就是说是将这6W条数据放置在内存里造成的系统延迟，这样说使用web worker应该也是有用的

Answer 1

问题已解决，是我代码问题。延迟是因为我绘制了超出canvas width&height范围的路径，数据量大时路径长度已有几十万~~。js处理数万长度的数组性能还是可以的。
不过有一点值得说的是，chrome在统计方法调用时长的时候把绘制canvas展示范围外路径的用时算到了System(self)里面。同样我用console.time/timeEnd包裹主渲染函数也没有得到真正的方法调用时。这也导致了我没有第一时间去定位到问题

Answer 2

虽然我自己也不会用，但是你这个需求听起来特别适合使用 webassembly 。js 本身的性能有限，再怎么挖掘也难以处理这种场景。