localStorageTest
在localStorage中存储一个递增的值,直到它达到浏览器的localStorage大小限制 .
function localStorageTest(key, len) {
var value = window.localStorage.getItem(key);
value = (value == null)?"":value;
var numIters = len - value.length;
while(numIters--) {
value += "1";
window.localStorage.setItem(key, value);
if (window.localStorage.getItem(key) != value) {
console.log("limit reached at " + (value.length-1).toString() + " bytes");
break;
}
}
console.log("stored " + value.length + " bytes");
}
铬:
localStorageTest("1", 80000);
<browser crashed>
火狐:
localStorageTest("1", 50000);
<browser crashed>
怀疑浏览器内存的使用量增加,我写了 localStorageIncrementalTest
,它与 localStorageTest
做了同样的事情,但是使用 setTimeOut
调用在其操作之间放置了5秒的空闲时间 .
var increment = 5000;
function localStorageIncrementalTest(key, len) {
var value = window.localStorage.getItem(key);
value = (value == null)?"":value;
var numIters = len - value.length;
var limitReached = false;
while(numIters--) {
value += "1";
window.localStorage.setItem(key, value);
if (window.localStorage.getItem(key) != value) {
console.log("limit reached at " + (value.length-1).toString() + " bytes");
limitReached = true;
break;
}
}
console.log("stored " + value.length + " bytes");
if (!limitReached) {
setTimeout(function() {
localStorageIncrementalTest(key, len+increment);
}, 5000);
}
}
Chrome:
localStorageIncrementalTest("1", 30000);
stored 30000 bytes
stored 35000 bytes
...
stored 1800000 bytes
<browser crashed>
Firefox:
localStorageIncrementalTest("1", 30000);
stored 30000 bytes
stored 35000 bytes
...
stored 60000 bytes
<browser crashed>
所以 localStorageIncrementalTest
允许我们在崩溃浏览器之前在localStorage中存储比 localStorageTest
更多的内容 .
任何人都可以解释浏览器崩溃背后的原因,以及避免相同的可能解决方案吗?
我使用的是Chrome 28.0.1500.71和Firefox 26.0
Update :
function getRandomValue(size) {
var value = "";
for (var i = 0; i < size; i++) {
value += Math.ceil(Math.random()*5);
}
return value;
}
function localStorageTest2() {
for (var i = 0; i < 70000; i++) {
window.localStorage.setItem("1", getRandomValue(20000));
}
}
Chrome:
localStorageTest2();
<browser crashed>
Firefox:
localStorageTest2();
<browser crashed>
测试 localStorage2
也导致浏览器崩溃 .
1 回答
我不确定浏览器崩溃的原因,但值得在crbug.com和bugzilla.mozilla.com报告 .
但是,localStorage不适用于此类用法 . 它是一种同步API,在浏览器使用时会给浏览器带来很大的压力,特别是当它经常使用时会导致页面表现不佳 .
此外,您的测试不会产生正确的结果 -
setItem(x, y)
会在超出限制时抛出异常 .localStorage.setItem(x, y); if (y == localStorage.getItem(x)) { ... }
将永远不会到达if
部分,因为它会在达到限制时预先抛出异常 .替代方案是简单变量,服务器存储或IndexedDB .
Chrome还有FileSystem API和Web SQL Databases API,但最好不要依赖它们,因为在其他浏览器中不支持它们 .