localstorage檢測

localstorage檢測

初來乍到，剛剛接觸一個從零開始的移動wap項目，但願內容根據策略(正在思考中)在瀏覽器中緩存，appcache、localstorage都做爲泛化知識進行了解和練習，知道appcache有不少坑，考慮到以前專門去封裝過localstorage的api而且也瞭解過鬼道寫的store.js的原理，所以就決定用localstorage，可是使用以前就寫這篇文章做爲調研結果。

項目對於存儲雖然沒有提出須要多麼精確，既然使用了必定須要考慮存儲的量精確到什麼度，好比我要存多大的數據量，每次存儲的更新策略以及瀏覽器的支持程度。

固然我以前也有碰見過localstorage在瀏覽器失效的問題

好了，看起來很樂觀，廢話很少說了，開始寫測試代碼吧，cache.js

function testCache(data, isCn) {
        var len = data.length * (isCn ? 2 : 1);
        var i = 0;
        cacheAPI.clear();
        var totalTime = 0;
        try {
            var startTime = +new Date();
            for(i = 0; i < 1000000; i++) {
                cacheAPI.set(i, data);
            }
        } catch(e) {
            console.log(e)
        }
        i--;
        totalTime = Math.floor((+new Date() - startTime) /1000);
        console.log('單次存儲字節數:' + len + ',key數:' + i + ',耗時:' + totalTime + 's,存儲大小:' + (len * i /1024) + 'kb' + ',速度:' + ((len * i /1024) / totalTime) + 'kb/s')
    }
     testCache('測試', 1)

　　

如下爲chrome下測試結果 一次存儲一個字節： key規則:'test' + i(1-100000)

key數:486725,耗時:23s,存儲大小:3802.546875kb,速度:165.328125kb/s

　　

key規則:’j’ + i(1-1000000)

key數:669247,耗時:32s,存儲大小:5228.5kb,速度:163.390625kb/s

　　

key規則: i(1-1000000)

 單次存儲字節數:1,key數:764854,耗時:39s,存儲大小:5975.421875kb,速度:153.21594551282053kb/s

　　

如下測試key均爲i(1-1000000) 其餘存儲長度的測試數據

單次存儲字節數:8,key數:382426,耗時:18s,存儲大小:2987.703125kb,速度:165.98350694444446kb/s

單次存儲字節數:16,key數:223081,耗時:10s,存儲大小:3485.640625kb,速度:348.5640625kb/s

單次存儲字節數:32,key數:133848,耗時:6s,存儲大小:4182.75kb,速度:697.125kb/s

單次存儲字節數:64,key數:73998,耗時:3s,存儲大小:4624.875kb,速度:1541.625kb/s

　　

存儲漢字的測試數據

單次存儲字節數:2,key數:594886,耗時:29s,存儲大小:1161.88671875kb,速度:40.06505926724138kb/s

單次存儲字節數:4,key數:535398,耗時:24s,存儲大小:2091.3984375kb,速度:87.1416015625kb/s

單次存儲字節數:8,key數:446164,耗時:21s,存儲大小:3485.65625kb,速度:165.98363095238096kb/s

單次存儲字節數:16,key數:334623,耗時:15s,存儲大小:5228.484375kb,速度:348.565625kb/s

單次存儲字節數:32,key數:223081,耗時:21s,存儲大小:6971.28125kb,速度:331.9657738095238kb/s

單次存儲字節數:64,key數:133848,耗時:6s,存儲大小:8365.5kb,速度:1394.25kb/s

單次存儲字節數:128,key數:73998,耗時:6s,存儲大小:9249.75kb,速度:1541.625kb/s

單次存儲字節數:512,key數:19976,耗時:1s,存儲大小:9988kb,速度:9988kb/s

單次存儲字節數:1024,key數:10122,耗時:0.756s,存儲大小:10122kb,速度:13388.888888888889kb/s

　　

上邊的測試數據僅僅是在極限的狀況下產生的數據，固然業務自己指定不會有這麼頻繁的存儲。 這裏是單詞存儲狀況

單次存儲字節數:1,key數:1,耗時:0ms,存儲大小:0.0009765625kb,速度:Infinitykb/ms

單次存儲字節數:2,key數:1,耗時:0ms,存儲大小:0.001953125kb,速度:Infinitykb/ms

單次存儲字節數:4,key數:1,耗時:0ms,存儲大小:0.00390625kb,速度:Infinitykb/ms

單次存儲字節數:8,key數:1,耗時:0ms,存儲大小:0.0078125kb,速度:Infinitykb/ms

單次存儲字節數:16,key數:1,耗時:0ms,存儲大小:0.015625kb,速度:Infinitykb/ms

單次存儲字節數:32,key數:1,耗時:0ms,存儲大小:0.03125kb,速度:Infinitykb/ms

單次存儲字節數:64,key數:1,耗時:0ms,存儲大小:0.0625kb,速度:Infinitykb/ms

單次存儲字節數:128,key數:1,耗時:0ms,存儲大小:0.125kb,速度:Infinitykb/ms

單次存儲字節數:256,key數:1,耗時:0ms,存儲大小:0.25kb,速度:Infinitykb/ms

單次存儲字節數:512,key數:1,耗時:0ms,存儲大小:0.5kb,速度:Infinitykb/ms

單次存儲字節數:1024,key數:1,耗時:0ms,存儲大小:1kb,速度:Infinitykb/ms

　　

從頻繁存儲的角度來看，實際存儲的key的數量也會影響存儲的大小，chrome上最大10m左右，感受跑下來全部數據對電腦傷害好大，想說好多，測試過程當中真的是各類噁心啊。其餘瀏覽器沒有測試，頭疼啊。