Excel绘制优化细节记录

[bojue]

优化细节

1. 局部渲染

• 仅仅渲染可视化区域的内容（ok）

2. 节流

• 位置：拖拽宽高的button使用位置节流，如果拖拽状态和上个状态一致，不触发drag事件的计算和赋值（ok）
• 坐标：区域选择，当前坐标和上个状态坐标相同，不触发计算和区域绘制（ok）

3. 减少绘制

• 坐标节流（ok）
• 拖拽改变宽高，监听drag事件但是不触发重绘canvas,只在mouseUp事件，触发绘制（ok）
• 设置属性，如果和之前的属性一直，不触发绘制（ok）

4. 拆分计算

• 对象状态维护，区域选择先计算可视区域，绘制，然后计算不可视区域的对象维护[这个是因为数据结构定义的问题]
• 数据量巨大可以按需加载渲染数据对象
• 将excel对象拆分两部分，内容+属性设置

5. 对象缓存

• 记录当前的状态，比如按照行列选择的状态，如果和上个状态一致，则不需要触发渲染（ok）

6. 模糊处理

• 高清屏幕画板缩小4倍（ok）
• 高清屏幕模糊问题，采用devicePixelRatio 做了缩放适配，减少开发过程中的缩放变量维护
• 绘制1px线条模糊问题（ok）

7. 双缓存方案

• 区域选择的时候，使用双缓存方案
• 撤销，反撤销使用双缓存方案