Cesium中使用IndexDB缓存数据

IndexDB

IndexedDB 简单的说就是一个运行在浏览器的本地数据库，允许网页在用户的浏览器中存储结构化数据，并且可以高效地进行检索、查询和修改。并且不像传统的 cookie 或 localStorage 只能存储有限的数据量，IndexedDB 能够存储大量数据。

在 Cesium 中使用 IndexDB 缓存数据

很多厂商都已经利用这项技术提高了 Cesium 第二次加载的速度(对于网络服务响应较慢的数据会有比较明显的提升)。

GitHub 上有相关闭源插件可以用CesiumOfflineCache、CesiumNetworkPlug。

但是上面两个库只提供了压缩之后的包，虽然可以直接绕过日期的许可直接使用。

这里还是本着会做才是自己的想法，尝试模仿着写了一个。

原理

Cesium 几乎所有的数据都是通过 Cesium.Resource 请求回来的。因此我们只需要将请求回来的数据存储到 IndexDB 中，并且下次请求之前，先尝试从 IndexDB 中获取，如果获取得到，就用 IndexDB 的数据，如果不行才发起请求。

localForage

localForage 是一个简单的操作浏览器数据库的库，它有一个优雅降级策略，若浏览器不支持 IndexedDB 或 WebSQL，则使用 localStorage。在所有主流浏览器中都可用：Chrome，Firefox，IE 和 Safari（包括 Safari Mobile）。

CesiumNetworkPlug 的 README.md 中有提到使用了这个库，所以这里也用这个来实现。

具体实现

实现起来其实并不复杂。

首先利用 localForage 打开/创建一个 IndexDB 数据库，用于存储请求回来的数据。

然后修改 Cesium.Resource 的对应方法（修改源码或者直接替换对应方法的实现），添加如下操作即可。

实际效果

Cesium 用 IndexDB 缓存优化二次加载效率

原文链接

Cesium中使用IndexDB缓存数据