The strategy of localStorage's storage space in FireFox and Chrome.

This artical will introduce the strategy of the usage of storage space of FireFox and Chrome.

recently our QA met an exception in production in Firefox, while this exception don't occur in chrome, the exception is as follows: 
“Persistent Storage maximum size reached” code:"1014" nsresult: "0x80530f6(NS_ERROR_DOM_QUOTA_REACHED); 

I checked the size of the localstorage on her machine, by using JSON.stringify(localStorage).length. 
The size is about 500KB, the size of the new item to set is about 300KB, the total size will be about 800KB, it is far less than 5MB, it is strange that localStorage has reached its maximum size. 

for example, suppose we have three different sub-domains under one top level domain "domain.com" 
do prepare: 
clear localstorage of a1.domain.com, a2.domain.com and a3.domain.com. 

in a1.domain.com run: 
localStorage.setItem(‘item1’,content1) // size of content1 is 2.3MB. 

in a2.domain.com run: 
localStorage.setItem(‘item2’,content2) // size of content2 is 2.7MB 

in a1.domain.com, run: 
JSON.stringify(localStorage).length; // 2.3MB 
localStorage.getItem(‘item1’); // content1 
localStorage.getItem(‘item2’); // undefined 

in a2.domain.com, run: 
JSON.stringify(localStorage).length; // 2.7MB 
localStorage.getItem(‘item1’); // undefined 
localStorage.getItem(‘item2’); // content2 

in a3.domain.com, run: 
JSON.stringify(localStorage).length; // 0KB 
localStorage.getItem(‘item1’); // undefined 
localStorage.getItem(‘item2’); // undefined 
localStorage.setItem(‘item3’,content3) // size of content3 is 100KB. 
result : Persistent Storage maximum size reached" code:"1014" nsresult: "0x80530f6(NS_ERROR_DOM_QUOTA_REACHED).

 

After research, I found that firefox shared the same space for localStorage per top level domain, that is a1.domain.com, a2.domain.com and a3.domain.com will share the same space of localStorage, because the top level domain of them are both “domain.com”. 

 

After doing the same test in chrome, I have following Conclusion:

in FireFox, all sub domains under the same top level domain don't share the data they stored in localStorage, but the total size of all the sub domains and the top level domain will be 5M.

in Chrome, each of the sub domains and the top level domain don't share the data they store in localStorage, and the total size of each sub-domain and top level domain will be 2.5M