2018.11.16

[wtfjun]

本周相关的需求有

[WK] 影像水印使用canvas替代原有dom绘制

[WK] 企业贷支持追加授信业务

[WK] 添加“地址备注”字段需求

还有部分bug等

本周分享：

前端所能做的调用接口优化

悟空中获取影像集的接口需要传一个数组（编号数组），接口会将所包含的编号与表进行关联（不清楚关联了几个表，有可能是多表关联），关联表的操作join 是笛卡尔乘积，会导致表以乘法的倍数方法。在集成环境中，据说有60w+影像数据，导致当接口数组大小为10时，接口耗时已经达到20s。当数组大小超过30时，甚至会导致接口直接错误（超时等）。

其实我们可以把数组进行拆分，使用promise.all等待全部接口请求成功，得到结果。这样一来，表的大小降了一个数量级（取决于数组大小），后台接口返回便会快了很多（20s->6s）。这里有个问题，我们知道请求多，tcp的连接与断开就要不断重复，这里有一定的耗时。但是这个耗时相比关联表查询是小很多的，因此忽略。

使用cancas替代dom绘制水印

原有的解决方案是在一定区域绘制n个水印dom，随着系统功能的迭代跟变更，当图片放大的时候水印dom也需要增加。这样绘制水印不是比较友好的解决方案，如果使用cancas作为background，设置为repeat（重复），性能会比dom更好，感觉也顺畅很多。不过还可以做得更完善，比如监听dom的改变，避免用户控制台直接删掉水印，或者直接在图片上绘制水印也是可以的。