indexedDB在概念上与HTML5本地存储有何不同？

Question 1

indexedDB和本地存储都是键值存储。拥有两个键/值存储区有什么优势？
indexedDB是异步的，但是联接（最耗时的事情）是手动的。它们似乎在与异步调用相同的线程中运行。这如何不会阻止UI？
indexedDB允许更大的存储。为什么不增加HTML5商店的大小？
我挠头。indexedDB的意义是什么？

Question 2

与本地存储不同，IndexedDB不是键值存储。本地存储仅存储字符串，因此要将对象放入本地存储，通常的方法是JSON.stringify它：

myObject = {a: 1, b: 2, c: 3};
localStorage.setItem("uniq", JSON.stringify(myObject));

这对于使用key查找对象是很好的选择uniq，但是从本地存储中获取myObject属性的唯一方法是对JSON.parse对象进行检查：

var myStorageObject = JSON.parse(localStorage.getItem("uniq"));
window.alert(myStorageObject.b);

如果本地存储中只有一个或几个对象，这很好。但是，假设您有上千个对象，所有对象都有一个属性b，而您只想对其中的对象做些事情b==2。使用本地存储，您将不得不遍历整个商店并检查b每个项目，这是很多浪费的处理。

使用IndexedDB，您可以在值中存储字符串以外的内容：“其中包括简单类型，例如DOMString和Date以及Object和Array实例。” 不仅如此，您还可以在值中存储的对象的属性上创建索引。因此，使用IndexedDb，您可以在其中放置同样的数千个对象，但可以在b属性上创建索引，并使用该索引仅检索对象，b==2而无需扫描存储中的每个对象。

至少那是主意。IndexedDB API不是很直观。

它们似乎在与异步调用相同的线程中运行。这如何不会阻止UI？

异步与多线程不是同一件事，JavaScript通常不是多线程。在JS中进行的任何繁重处理都会阻塞UI，如果您希望最小化阻塞UI，请尝试Web Workers。

indexedDB允许更大的存储。为什么不增加HTML5商店的大小？

因为，如果没有适当的索引编制，它变得越来越大，它将变得越来越慢。

Question 3

我碰到了这篇很好的文章，讨论了localstorage vs indexeddb和其他可能的选项。

（以下所有值均以毫秒为单位）

https://nolanlawson.com/2015/09/29/indexeddb-websql-localstorage-what-blocks-the-dom/

总结一下这篇文章（完全是作者的观点），

在Chrome，Firefox和Edge的所有三个版本中，LocalStorage在写入数据2时完全阻止DOM。与内存相比，这种阻止要明显得多，因为浏览器实际上必须刷新到磁盘。
毫不奇怪，由于任何同步代码都在阻塞，因此内存中操作也在阻塞。DOM在长时间运行的插入过程中会阻塞，但是除非您处理大量数据，否则您不太可能注意到，因为内存中的操作确实非常快。
在Firefox和Chrome中，对于基本键值插入，IndexedDB的速度比LocalStorage慢，并且它仍会阻止DOM。在Chrome中，它的速度也比WebSQL慢，WebSQL确实可以阻止DOM，但速度却不那么快。只有在Edge和Safari中，IndexedDB才能在不中断UI的情况下在后台运行，而且更糟糕的是，这两个浏览器仅部分实现了IndexedDB规范。
IndexedDB在Web工作者中运行良好，在该工作者中，它的运行速度大致相同，但没有阻塞DOM。唯一的例外是Safari，它不支持工作程序内部的IndexedDB，但仍不会阻止UI。
如果数据简单且最少，则本地内存是理想的选择

Question 4

除了robertc的答案外，indexedDB还知道“范围”，因此您可以搜索和检索所有以“ ab”开头并以abd结尾的记录，以查找“ abc”等。

Question 5

在浏览器的控制台中运行以下命令。它将在Application> Storage中与LocalStorage和SessionStorage一起创建一个单独的实体

const request = indexedDB.open("notes");
request.onupgradeneeded = e => {
  alert("upgrade");
}
request.onsuccess = e => {
  alert("success");
}
request.onerror = e => {
  alert("error");
}

您可以使用所有CRUD操作来查询此存储，这与其他两个存储具有较小的灵活性和可玩性的存储不同。