场景场景最近在生产环境遇到了下面这样一个场景:
后台在字典表中存储了一些之前需要前后端共同维护的枚举值,并提供根据 type/id 获取字典的 API。所以在渲染列表的时候,有很多列表的字段直接就是字典的 id,而没有经过后台的数据拼装。起初,吾辈解决问题的流程如下
确定字典字段,添加转换后的对象类型接口
将对象列表进行转换得到其中字典字段的所有值
对字典 id 列表进行去重
根据 id 列表从后台获取到所有的字典数据
将获得的字典数据转换为 id => 字典 的 Map
遍历最初的列表,对里面指定的字典字段进行转换
确定字典字段,添加转换后的对象类型接口将对象列表进行转换得到其中字典字段的所有值对字典 id 列表进行去重根据 id 列表从后台获取到所有的字典数据将获得的字典数据转换为 id => 字典 的 Map遍历最初的列表,对里面指定的字典字段进行转换可以看到,上面的步骤虽然不麻烦,但却十分繁琐,需要定义额外的类型不说,还很容易发生错误。思路
思路
使用 异步批处理 + LRU 缓存 优化性能
支持异步 formatter 获得更好的使用体验
使用 异步批处理 + LRU 缓存 优化性能支持异步 formatter 获得更好的使用体验
实现异步批处理实现异步批处理参考实现:
import { wait } from '../async/wait'
/**
* 将多个并发异步调用合并为一次批处理
* @param handle 批处理的函数
* @param ms 等待的时长(时间越长则可能合并的调用越多,否则将使用微任务只合并一次同步执行的所有调用)
*/
export function batch
(
handle: (list: P[]) => Promise