批量设置单元格值的性能优化

在给一个单元格区域设置单元格值的时候，我们一般通过循环行列来设置单元格值

1. sheet.setValue(rowindex,columnindex,value)

复制代码

或者给区域设置数组

1. sheet.setArray(0,0,array)

复制代码

当行列数较大的时候，会发现设置的速度很慢。
以20列200000行为例进行测试
创建数组

1. var array=[];
   
2. for (let r = 0; r < 200000; r++) {
   
3.     var row=[];
   
4.     for (let c = 0; c < 20; c++) {
   
5.         row.push(r+c);
   
6.     }
   
7.     array.push(row);
   
8. }

复制代码

通过setArray设置给sheet需要7.2s，这个时间确实比较慢

1. console.time('setarray');
   
2. sheet.setRowCount(20000);
   
3. sheet.setArray(0, 0, array);
   
4. console.timeEnd('setarray');

复制代码

接下来，通过下面的几个步骤来进行优化

1.加上挂起/恢复绘制

1. console.time('setarray');
   
2. workbook.suspendPaint();
   
3. sheet.setRowCount(20000);
   
4. sheet.setArray(0, 0, array);
   
5. workbook.resumePaint();
   
6. console.timeEnd('setarray');

复制代码

耗时7171ms，看起来在这个场景里面没有什么优化

2.加上挂起/恢复事件

1. console.time('setarray');
   
2. <blockquote>workbook.suspendPaint();

复制代码

耗时: 744 ms，优化效果明显

3.继续给加上挂起计算引擎和挂起脏数据

1. console.time('setarray');
   
2. workbook.suspendPaint();
   
3. workbook.suspendEvent();
   
4. workbook.suspendCalcService();
   
5. sheet.suspendDirty();
   
6. sheet.setRowCount(20000);
   
7. sheet.setArray(0, 0, array);
   
8. sheet.resumeDirty();
   
9. workbook.resumeCalcService();
   
10. workbook.resumeEvent();
    
11. workbook.resumePaint();
    
12. console.timeEnd('setarray');

复制代码

耗时: 666ms，相比下仍有优化效果

总结：
在对较大区域的单元格设置值的时候，通过setArray配合绘制，事件挂起，脏数据挂起等方法可以让设置速度有数量级的提升。避免页面卡死

更多性能方面的优化说明，也可以参考产品文档中的最佳实践部分
https://demo.grapecity.com.cn/spreadjs/help/docs/BestPractices