localStorage，在内存填满时更好地处理

Question

我正在编写一个可以获取大量图像数据的应用程序，这样做需要花费一些时间，并且在此期间用户正在等待。 当我得到数据时，我想存储它，以防用户想要很快再次看到它。我在html5中经历了一些本地存储方法，对我来说最有希望的似乎是localStorage。 本地存储的一个缺点是，它往往不允许存储大量数据，大多数情况下都是5Mb，我的想法是每次我获取一些数据，将其存储在localStorage中。当那些可怜的小5MB被填满时会出现问题，然后我想从内存中删除最旧的元素，因为一切都只是存储在键值对中，似乎没有简单的方法。

所以我不太确定在这种情况下如何继续使用localStorage。 是否有任何模块或某些东西可以使上述方式更容易使用localStorage？

Answer 1

你可以使用 1）IndexedDB存储大量数据但它只能在除Opera mini之外的最新浏览器中工作。 2）或者，将您的数据存储在内存中，然后存储到本地存储中，反之亦然。 3）您始终可以将时间标记与您存储的每个密钥一起使用。您可以遍历具有特定格式的密钥以获取存储中的最旧密钥，您可以轻松删除它。 4）您还可以将时间戳记放在包含图像数据的数据中，在这种情况下，您不必从商店中提取所有键，而是完整的数据对象。

我建议您使用IndexedDB选项来克服您的大小限制。

希望这会有所帮助。

Answer 2

最后我使用了这个模块：https://gist.github.com/ragnar-johannsson/10509331。 使用它，如果没有足够的内存来添加新值，则会删除最旧的值。