我在第三代 iPad 上安装了 iOS 8，并在 Safari 中尝试了 IndexedDB。我的示例代码只是将 1000 个对象添加到对象存储中。
它可以工作，但与具有类似或较弱硬件的其他设备相比，它非常慢。
See this snippet for implementation details (IndexedDB seems to be disabled on stackoverflow so the example does not work out of the box - use this fiddle http://jsfiddle.net/a5p6mL6m/1/ instead):
将代码片段添加到 jsbin，因为 jsfiddle 在 iOS 设备上引发 SecurityException 并使用 Deni Spasovskis 答案进行更新http://jsbin.com/jorohe/1/ http://jsbin.com/jorohe/1/。问题仍然存在。
原始代码：
var openRequest = window.indexedDB.open("testdb");
openRequest.onsuccess = function (event) {
document.getElementById("output").innerHTML += "open success<br/>";
var db = event.target.result;
var trans = db.transaction(["testStore"], (typeof IDBTransaction.READ_ONLY !== "undefined") ? IDBTransaction.READ_WRITE : "readwrite" );
var store = trans.objectStore("testStore");
var reqClear = store.clear();
reqClear.onsuccess = function () {
var objectsToAdd = 1000;
var addedObjects = 0;
var startTime = window.performance.now();
for (var i=0; i<objectsToAdd; i++) {
(function (pos) {
var req = store.add({testID: pos, a: "foo", b: "bar"});
req.onsuccess = function () {
addedObjects++;
if (addedObjects >= objectsToAdd) {
document.getElementById("output").innerHTML += "done adding<br />";
document.getElementById("output").innerHTML += "Took: "+(window.performance.now() - startTime)+"ms<br />";
}
}
req.onerror = function () {
document.getElementById("output").innerHTML += "error adding element:" + req.error + " <br/>";
}
})(i);
}
}
reqClear.onerror = function () {
document.getElementById("output").innerHTML += "error clearing store: "+reqClear.error+"<br/>";
}
};
openRequest.onupgradeneeded = function (event) {
var db = event.target.result;
var objectStore = db.createObjectStore("testStore", { keyPath: "testID" });
document.getElementById("output").innerHTML += "created store<br/>";
};
openRequest.onerror = openRequest.onabort = function () {
document.getElementById("output").innerHTML += "error opening db<br/>";
}
<div id="output">
</div>
iPad 大约需要 6 秒，而 HTC Windows Phone 8s（较弱的硬件）上的 Internet Explorer 仅花了 1.5 秒，三星 Galaxy S III（可能与 iPad 相当）上的 Chrome 在 300 毫秒内完成了插入。
虽然我知道这项技术在 iOS 上是新技术，但我并没有预料到性能会有如此严重的下降。
代码有什么问题吗？或者有其他方法可以在 iOS 设备上使用 IndexedDB 实现良好的性能吗？
为了在批量插入时获得最佳性能，您不应该在每个添加语句上侦听事件，而应该附加到事务oncomplete and onerror事件。
我对您的代码进行了一些更改，并在我的手机 (nexus 4) 上获得了 15% 的性能提升（从 ~340ms 下降了 ~290ms）。但与 PC 相比，这仍然很慢。
该代码片段不起作用，因此这里是 jsFiddle 的链接：http://jsfiddle.net/a5p6mL6m/2/ http://jsfiddle.net/a5p6mL6m/2/
var openRequest = window.indexedDB.open("testdb");
openRequest.onsuccess = function (event) {
document.getElementById("output").innerHTML += "open success<br/>";
var db = event.target.result;
var trans = db.transaction(["testStore"], (typeof IDBTransaction.READ_ONLY !== "undefined") ? IDBTransaction.READ_WRITE : "readwrite" );
var store = trans.objectStore("testStore");
var startTime;
trans.oncomplete = function () {
document.getElementById("output").innerHTML += "finished adding<br />";
document.getElementById("output").innerHTML += "End time: "+(window.performance.now() - startTime)+"<br />";
}
var reqClear = store.clear();
reqClear.onsuccess = function () {
startTime = window.performance.now();
var objectsToAdd = 1000;
var addedObjects = 0;
for (var i=0; i<objectsToAdd; i++) {
store.add({testID: i, a: "foo", b: "bar"});
}
}
reqClear.onerror = function () {
document.getElementById("output").innerHTML += "error clearing store: "+reqClear.error+"<br/>";
}
};
openRequest.onupgradeneeded = function (event) {
var db = event.target.result;
var objectStore = db.createObjectStore("testStore", { keyPath: "testID" });
document.getElementById("output").innerHTML += "created store<br/>";
};
openRequest.onerror = openRequest.onabort = function () {
document.getElementById("output").innerHTML += "error opening db<br/>";
}
<div id="output">
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
