在前端开发中，处理海量数据的渲染已有不少成熟方案：虚拟列表精准控制可视区域、时间分片平衡渲染与交互、分页加载渐进呈现内容。但当业务场景转向数据计算密集型任务时，就会面临截然不同的挑战：计算耗时引发交互冻结、复杂算法拖慢主线程、内存泄漏导致页面卡死等等。而这类问题的解决方案在前端领域却鲜少被讨论，相关可参考的文章也比较少。
本文将结合示例，探讨在10w+数据量级下可行的解决思路，涵盖数据结构优化、并行计算策略等关键技术点，抛砖引玉供大家参考讨论。
首先我这里假设一个场景：我们现在有一个表，当前这个表有10w+的数据量，现在有几个功能，分别是筛选、排序和分组。在前端需要根据筛选条件、排序规则和分组规则对数据进行计算，然后将最终的结果做一个展示。表格是可以操作的，用户修改了表格某个单元格的值，那么前端就要根据当前的数据重新进行筛选、排序和分组的计算操作，将计算后的排列结果呈现在表格上。
这个场景下很明确前端的计算耗时就在筛选、排序和分组上。我们先用代码简单模拟下。
more >>