dum*_*ter 5 javascript performance indexeddb
在IndexedDB中,有两种方法可以更新数据库中已有的对象.你可以打电话IDBCursor.update或IDBObjectStore.put.
两者都接受更新的对象作为参数.
IDBCursor.update要求你先打开一个光标,但你基本上也必须这样做IDBObjectStore.put以检索先前的值.
IDBObjectStore.put 如果找不到要更新的对象,将创建一个新对象,但由于它必须首先检查更新,我不知道这是否会实际产生性能差异.
那么这些方法有什么区别呢？有什么我想念的吗？我试图制作一个测试用例来调查性能差异:
var db;
function runTest(N, cb) {
console.log("N = " + N);
// Add some fake data to object store
var tx = db.transaction("store", "readwrite");
tx.objectStore("store").clear();
for (var i = 0; i < N; i++) {
tx.objectStore("store").add({"id": i, "index":0,"guid":"21310c91-ff31-4cb9-ae68-16d48cbbd84a","isActive":false,"balance":"$1,840.25","picture":"http://placehold.it/32x32","age":33,"eyeColor":"brown","name":"Witt Fletcher","gender":"male","company":"QUILM","email":"wittfletcher@quilm.com","phone":"+1 (851) 485-2174","address":"729 Conover Street, Marenisco, Virginia, 7219","about":"Incididunt do deserunt ut quis. Exercitation et ut ad aliqua ut do sint Lorem. Aliquip sit aliquip nulla excepteur pariatur ut laborum ea dolor. Consectetur incididunt et et esse commodo id eu dolor in. Nostrud sit mollit occaecat ullamco commodo aute anim duis enim et aliqua. Aute duis nostrud do minim labore sunt mollit in voluptate aliquip sit. Aliqua aliquip non ipsum exercitation cillum irure in.\r\n","registered":"2014-07-02T03:42:57 +04:00","latitude":-65.942119,"longitude":-129.471674,"tags":["reprehenderit","nostrud","velit","exercitation","nulla","nulla","est"],"friends":[{"id":0,"name":"Kristine Francis"},{"id":1,"name":"Lizzie Ruiz"},{"id":2,"name":"Bobbie Underwood"}],"greeting":"Hello, Witt Fletcher! You have 7 unread messages.","favoriteFruit":"apple"});
}
tx.oncomplete = function () {
// Update with cursor.update
var tStart = (new Date()).getTime();
tx = db.transaction("store", "readwrite");
var store = tx.objectStore("store");
for (var i = 0; i < N; i++) {
store.openCursor(i).onsuccess = function (event) {
var cursor = event.target.result;
cursor.value.age = 34;
cursor.update(cursor.value);
};
}
tx.oncomplete = function () {
var tEnd = (new Date()).getTime();
console.log("cursor.update - " + (tEnd - tStart) + " milliseconds");
// Update with put
tStart = (new Date()).getTime();
tx = db.transaction("store", "readwrite");
store = tx.objectStore("store");
for (var i = 0; i < N; i++) {
store.openCursor(i).onsuccess = function (event) {
var cursor = event.target.result;
cursor.value.age = 34;
store.put(cursor.value);
};
}
tx.oncomplete = function () {
tEnd = (new Date()).getTime();
console.log("put - " + (tEnd - tStart) + " milliseconds");
if (cb !== undefined) {
cb();
}
};
};
};
}
request = indexedDB.open("yes5ytrye", 1);
request.onerror = function (event) { console.log(event); };
request.onupgradeneeded = function (event) {
var db = event.target.result;
db.onerror = function (event) { console.log(event); };
db.createObjectStore("store", {keyPath: "id"});
};
request.onsuccess = function (event) {
db = request.result;
db.onerror = function (event) { console.log(event); };
runTest(100, function () {
runTest(1000, function () {
runTest(10000, function () {
console.log("Done");
});
});
});
};
你可以在这里试试.
在Firefox中,我输出如下:
N = 100
cursor.update - 39 milliseconds
put - 40 milliseconds
N = 1000
cursor.update - 229 milliseconds
put - 256 milliseconds
N = 10000
cursor.update - 2194 milliseconds
put - 2096 milliseconds
Done
基本上没有性能差异.当Chrome N很大时,结果会略有不同:
N = 100
cursor.update - 51 milliseconds
put - 44 milliseconds
N = 1000
cursor.update - 414 milliseconds
put - 447 milliseconds
N = 10000
cursor.update - 13506 milliseconds
put - 22783 milliseconds
Done
但就像我上面所说的那样,我甚至不确定这两种方法之间是否存在差异,因为它们似乎必须完全相同.
update cursor和之间的主要区别put在于，您需要检索要更新的元素cursor；另一方面，当使用该put语句时，您只需要知道id要更新的元素的，并且只需执行put在该store级别上定义的函数即可。然而，这种加速仅在将完整对象存储在内存中的情况下才有效。
我更新了你的代码并提高了速度：
var db;
function runTest(N, cb) {
console.log("N = " + N);
// Add some fake data to object store
var tx = db.transaction("store", "readwrite");
tx.objectStore("store").clear();
for (var i = 0; i < N; i++) {
tx.objectStore("store").add({"id": i, "index":0,"guid":"21310c91-ff31-4cb9-ae68-16d48cbbd84a","isActive":false,"balance":"$1,840.25","picture":"http://placehold.it/32x32","age":33,"eyeColor":"brown","name":"Witt Fletcher","gender":"male","company":"QUILM","email":"wittfletcher@quilm.com","phone":"+1 (851) 485-2174","address":"729 Conover Street, Marenisco, Virginia, 7219","about":"Incididunt do deserunt ut quis. Exercitation et ut ad aliqua ut do sint Lorem. Aliquip sit aliquip nulla excepteur pariatur ut laborum ea dolor. Consectetur incididunt et et esse commodo id eu dolor in. Nostrud sit mollit occaecat ullamco commodo aute anim duis enim et aliqua. Aute duis nostrud do minim labore sunt mollit in voluptate aliquip sit. Aliqua aliquip non ipsum exercitation cillum irure in.\r\n","registered":"2014-07-02T03:42:57 +04:00","latitude":-65.942119,"longitude":-129.471674,"tags":["reprehenderit","nostrud","velit","exercitation","nulla","nulla","est"],"friends":[{"id":0,"name":"Kristine Francis"},{"id":1,"name":"Lizzie Ruiz"},{"id":2,"name":"Bobbie Underwood"}],"greeting":"Hello, Witt Fletcher! You have 7 unread messages.","favoriteFruit":"apple"});
}
tx.oncomplete = function () {
// Update with cursor.update
var tStart = (new Date()).getTime();
tx = db.transaction("store", "readwrite");
var store = tx.objectStore("store");
for (var i = 0; i < N; i++) {
store.openCursor(i).onsuccess = function (event) {
var cursor = event.target.result;
cursor.value.age = 34;
cursor.update(cursor.value);
};
}
tx.oncomplete = function () {
var tEnd = (new Date()).getTime();
console.log("cursor.update - " + (tEnd - tStart) + " milliseconds");
// Update with put
tStart = (new Date()).getTime();
tx = db.transaction("store", "readwrite");
store = tx.objectStore("store");
for (var i = 0; i < N; i++) {
//you don't need the element just update
store.put({"id": i, "index":0,"guid":"21310c91-ff31-4cb9-ae68-16d48cbbd84a","isActive":false,"balance":"$1,840.25","picture":"http://placehold.it/32x32","age":33,"eyeColor":"brown","name":"Witt Fletcher","gender":"male","company":"QUILM","email":"wittfletcher@quilm.com","phone":"+1 (851) 485-2174","address":"729 Conover Street, Marenisco, Virginia, 7219","about":"Incididunt do deserunt ut quis. Exercitation et ut ad aliqua ut do sint Lorem. Aliquip sit aliquip nulla excepteur pariatur ut laborum ea dolor. Consectetur incididunt et et esse commodo id eu dolor in. Nostrud sit mollit occaecat ullamco commodo aute anim duis enim et aliqua. Aute duis nostrud do minim labore sunt mollit in voluptate aliquip sit. Aliqua aliquip non ipsum exercitation cillum irure in.\r\n","registered":"2014-07-02T03:42:57 +04:00","latitude":-65.942119,"longitude":-129.471674,"tags":["reprehenderit","nostrud","velit","exercitation","nulla","nulla","est"],"friends":[{"id":0,"name":"Kristine Francis"},{"id":1,"name":"Lizzie Ruiz"},{"id":2,"name":"Bobbie Underwood"}],"greeting":"Hello, Witt Fletcher! You have 7 unread messages.","favoriteFruit":"apple"});
}
tx.oncomplete = function () {
tEnd = (new Date()).getTime();
console.log("put - " + (tEnd - tStart) + " milliseconds");
if (cb !== undefined) {
cb();
}
};
};
};
}
request = indexedDB.open("yes5ytrye", 1);
request.onerror = function (event) { console.log(event); };
request.onupgradeneeded = function (event) {
var db = event.target.result;
db.onerror = function (event) { console.log(event); };
db.createObjectStore("store", {keyPath: "id"});
};
request.onsuccess = function (event) {
db = request.result;
db.onerror = function (event) { console.log(event); };
runTest(100, function () {
runTest(1000, function () {
runTest(10000, function () {
console.log("Done");
});
});
});
};这是我的结果：
N = 100
cursor.update - 46 milliseconds
put - 28 milliseconds
N = 1000
cursor.update - 157 milliseconds
put - 114 milliseconds
N = 10000
cursor.update - 5530 milliseconds
put - 2391 milliseconds
Done
| 归档时间： |
|
| 查看次数： |
601 次 |
| 最近记录： |