¿Cuál es el tamaño máximo de los valores de localStorage?


Dado que localStorage (actualmente) solo admite cadenas como valores, y para hacer eso los objetos deben ser stringificados (almacenados como JSON-string) antes de que puedan ser almacenados, hay una limitación definida con respecto a la longitud de los valores.

¿Alguien sabe si hay una definición que se aplica a todos los navegadores?

Author: Eric Bishard, 2010-06-07

10 answers

Citando el artículo de Wikipedia sobre Almacenamiento web :

El almacenamiento web se puede ver de manera simplista como una mejora en las cookies, proporcionando una capacidad de almacenamiento mucho mayor ( 10 MB por origen en Google Chrome ( https://plus.google.com/u/0 / + FrancoisBeaufort / posts / S5Q9HqDB8bh), Mozilla Firefox y Opera; 10 MB por área de almacenamiento en Internet Explorer ) y mejores interfaces programáticas.

Y también citando a un John Resig artículo [publicado en enero de 2007]:

Espacio De Almacenamiento

Se implica que, con el almacenamiento DOM, tiene mucho más espacio de almacenamiento espacio que el típico agente de usuario limitaciones impuestas a las Cookies. Sin embargo, la cantidad que se proporciona no está definido en la especificación, tampoco es transmitido de manera significativa por el agente de usuario.

Si nos fijamos en el código fuente de Mozilla podemos ver que 5120KB es el valor predeterminado tamaño de almacenamiento para un dominio. Esto le da considerablemente más espacio para trabajar con un 2KB típico cookie.

Sin embargo, el tamaño de esta área de almacenamiento puede ser personalizado por el usuario (so a El área de almacenamiento de 5MB no está garantizada, ni está implícito) y el agente de usuario (Opera, por ejemplo, solo puede proporcionar 3MB - pero solo el tiempo lo dirá.)

 346
Author: Daniel Vassallo,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-01-15 05:11:01

En realidad Opera no tiene límite de 5MB. Ofrece aumentar el límite a medida que las aplicaciones requieren más. El usuario puede incluso elegir "Almacenamiento ilimitado" para un dominio.

Puede probar fácilmente Los límites de almacenamiento local/cuota usted mismo.

 112
Author: Artemy Tregubenko,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-07-15 21:24:43

Aquí hay un script sencillo para averiguar el límite:

if (localStorage && !localStorage.getItem('size')) {
    var i = 0;
    try {
        // Test up to 10 MB
        for (i = 250; i <= 10000; i += 250) {
            localStorage.setItem('test', new Array((i * 1024) + 1).join('a'));
        }
    } catch (e) {
        localStorage.removeItem('test');
        localStorage.setItem('size', i - 250);            
    }
}

Aquí está la esencia, JSFiddle and blog post.

El script probará la configuración de cadenas de texto cada vez más grandes hasta que el navegador arroje y la excepción. En ese punto, borrará los datos de prueba y establecerá una clave de tamaño en localStorage almacenando el tamaño en kilobytes.

 60
Author: cdmckay,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-09-12 16:32:19

No asuma que 5MB está disponible: la capacidad de almacenamiento local varía según el navegador, siendo los valores más comunes 2.5 MB, 5MB e ilimitado. Fuente: http://dev-test.nemikor.com/web-storage/support-test/

 23
Author: tagawa,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-02-10 06:53:15

Encuentra la longitud máxima de una sola cadena que se puede almacenar en localStorage

Este fragmento encontrará la longitud máxima de una cadena que se puede almacenar en localStorage por dominio.

//Clear localStorage
for (var item in localStorage) delete localStorage[item];

window.result = window.result || document.getElementById('result');

result.textContent = 'Test running…';

//Start test
//Defer running so DOM can be updated with "test running" message
setTimeout(function () {

    //Variables
    var low = 0,
        high = 2e9,
        half;

    //Two billion may be a little low as a starting point, so increase if necessary
    while (canStore(high)) high *= 2;


    //Keep refining until low and high are equal
    while (low !== high) {
        half = Math.floor((high - low) / 2 + low);

        //Check if we can't scale down any further
        if (low === half || high === half) {
            console.info(low, high, half);
            //Set low to the maximum possible amount that can be stored 
            low = canStore(high) ? high : low;
            high = low;
            break;
        }


        //Check if the maximum storage is no higher than half
        if (storageMaxBetween(low, half)) {
            high = half;
            //The only other possibility is that it's higher than half but not higher than "high"
        } else {
            low = half + 1;
        }

    }

    //Show the result we found!
    result.innerHTML = 'The maximum length of a string that can be stored in localStorage is <strong>' + low + '</strong> characters.';

    //Functions
    function canStore(strLen) {
        try {
            delete localStorage.foo;
            localStorage.foo = Array(strLen + 1).join('A');
            return true;
        } catch (ex) {
            return false;
        }
    }


    function storageMaxBetween(low, high) {
        return canStore(low) && !canStore(high);
    }

}, 0);
<h1>LocalStorage single value max length test</h1>

<div id='result'>Please enable JavaScript</div>

Tenga en cuenta que la longitud de una cadena está limitada en JavaScript; si desea ver la cantidad máxima de datos que se pueden almacenar en localStorage cuando no se limita a una sola cadena, puede usar el código en esta respuesta.

Editar: Los fragmentos de pila no son compatibles con localStorage, por lo que aquí hay un enlace a JSFiddle.

Resultados

Chrome (45.0.2454.101): 5242878 personajes
Firefox (40.0.1): 5242883 personajes
Internet Explorer (11.0.9600.18036): 16386 122066 122070 los caracteres

Obtengo resultados diferentes en cada ejecución en Internet Explorer.

 20
Author: user2428118,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-10-12 18:52:36

No desea stringify objetos grandes en una sola entrada localStorage. Eso sería muy ineficiente-todo el asunto tendría que ser analizado y codificado cada vez que algunos pequeños cambios de detalle. Además, JSON no puede manejar múltiples referencias cruzadas dentro de una estructura de objetos y borra muchos detalles, por ejemplo, el constructor, las propiedades no numéricas de los arrays, lo que hay en una entrada dispersa, etc.

En su lugar, puede usar http://rhaboo.org . Almacena objetos grandes usando muchas entradas localStorage para que pueda hacer pequeños cambios rápidamente. Los objetos restaurados son copias mucho más precisas de los guardados y la API es increíblemente simple. Por ejemplo:

var store = Rhaboo.persistent('Some name');
store.write('count', store.count ? store.count+1 : 1);
store.write('somethingfancy', {
  one: ['man', 'went'],
  2: 'mow',
  went: [  2, { mow: ['a', 'meadow' ] }, {}  ]
});
store.somethingfancy.went[1].mow.write(1, 'lawn');

Por cierto, yo lo escribí.

 13
Author: Adrian May,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-10-01 11:32:00

Navegadores móviles:

Browser    | Chrome    | Android Browser    | Firefox     | iOS Safari
Version    | 40        | 4.3                | 34          | 6-8
Available  | 10MB      | 2MB                | 10MB        | 5MB

Navegadores de escritorio:

Browser    | Chrome   | Opera    | Firefox    | Safari      | IE
Version    | 40       | 27       | 34         | 6-8         | 9-11
Available  | 10MB     | 10MB     | 10MB       | 5MB         | 10MB
 13
Author: Behnam Mohammadi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-02-18 11:38:27

Me gusta mucho la respuesta de cdmckay, pero realmente no se ve bien comprobar el tamaño en tiempo real: es demasiado lento (2 segundos para mí). Esta es la versión mejorada, que es mucho más rápida y exacta, también con una opción para elegir qué tan grande puede ser el error (por defecto 250,000, el error más pequeño es - más largo es el cálculo):

function getLocalStorageMaxSize(error) {
  if (localStorage) {
    var max = 10 * 1024 * 1024,
        i = 64,
        string1024 = '',
        string = '',
        // generate a random key
        testKey = 'size-test-' + Math.random().toString(),
        minimalFound = 0,
        error = error || 25e4;

    // fill a string with 1024 symbols / bytes    
    while (i--) string1024 += 1e16;

    i = max / 1024;

    // fill a string with 'max' amount of symbols / bytes    
    while (i--) string += string1024;

    i = max;

    // binary search implementation
    while (i > 1) {
      try {
        localStorage.setItem(testKey, string.substr(0, i));
        localStorage.removeItem(testKey);

        if (minimalFound < i - error) {
          minimalFound = i;
          i = i * 1.5;
        }
        else break;
      } catch (e) {
        localStorage.removeItem(testKey);
        i = minimalFound + (i - minimalFound) / 2;
      }
    }

    return minimalFound;
  }
}

Para probar:

console.log(getLocalStorageMaxSize()); // takes .3s
console.log(getLocalStorageMaxSize(.1)); // takes 2s, but way more exact

Esto funciona dramáticamente más rápido para el error estándar; también puede ser mucho más exacto cuando necesario.

 6
Author: smnbbrv,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 10:31:39

Puede usar el siguiente código en los navegadores modernos para verificar eficientemente la cuota de almacenamiento (total y utilizado) en tiempo real:

if ('storage' in navigator && 'estimate' in navigator.storage) {
        navigator.storage.estimate()
            .then(estimate => {
                console.log("Usage (in Bytes): ", estimate.usage,
                            ",  Total Quota (in Bytes): ", estimate.quota);
            });
}
 4
Author: abhiweb,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-06-29 08:12:56

Estoy haciendo lo siguiente:

getLocalStorageSizeLimit = function () {

    var maxLength = Math.pow(2,24);
    var preLength = 0;
    var hugeString = "0";
    var testString;
    var keyName = "testingLengthKey";

    //2^24 = 16777216 should be enough to all browsers
    testString = (new Array(Math.pow(2, 24))).join("X");

    while (maxLength !== preLength) {
        try  {
            localStorage.setItem(keyName, testString);

            preLength = testString.length;
            maxLength = Math.ceil(preLength + ((hugeString.length - preLength) / 2));

            testString = hugeString.substr(0, maxLength);
        } catch (e) {
            hugeString = testString;

            maxLength = Math.floor(testString.length - (testString.length - preLength) / 2);
            testString = hugeString.substr(0, maxLength);
        }
    }

    localStorage.removeItem(keyName);

    maxLength = JSON.stringify(this.storageObject).length + maxLength + keyName.length - 2;

    return maxLength;
};
 3
Author: Itay Merchav,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-06-17 00:01:43