IndexedDB 的性能优化

IndexedDB 是前端存储的一个解决方案，能够提供客户端的大数据量可靠数据管理服务。

但它两个缺点：一是接口复杂，二是写入数据库时，有可能阻塞UI。

所以使用IndexedDB前，要问自己两个问题。

1. 可不可以用 LocalStorage 代替？
   对于大小在几MB之内，不需要检索，且方便序列化为字符串的数据，完全可以用 LocalStorage 代替IndexedDB，处理起来会更简单。

2. 可不可以直接向后端获取数据。
   其实理论上来说，同一时间，页面展示的信息量一般不会过大。因为用户本身也难以接受扑面而来的海量的信息，所以用懒加载的方式，按需向后端获取信息，能够减轻前端海量数据的渲染压力。当服务端压力不大时，完全没必要在前端再搭建一套数据管理服务。

如果确定要用IndexedDB，那么需要注意的是UI阻塞问题。

IndexedDB在写入数据时，会在主线程执行结构化克隆算法，如果对象过大，算法执行时会阻塞页面的渲染，让用户产生卡顿的感觉。

有三个方法来避免UI阻塞问题。

1. 避免巨型对象的直接写入。
   可以考虑把巨型对象分解成多个小对象，缩短单次写入的时长。

2. 存储巨型对象前，先将对象转换为字节，这样避免了结构化克隆算法的执行。
   类似前文 把函数转换为字符串， 可以利用 ArrayBuffer 将对象转换为二进制字节，后面读取的时候，再次转换回对象。

3. 使用 webworker 技术，避免阻塞主线程。