Contenido

El almacenamiento DOM y las Web Applications 1.0

12 Feb

+ 9

Josh Resig, creador de jQuery y actual encargado del desarollo del javascript de Mozilla Firefox. Publicó el otro día una entrada acerca del nuevo almacenamiento DOM, una de las partes más impotantes de las Web Applications 1.0.

 El almacenamiento DOM, es una versión mejorada de las cookies HTTP. En estas nuevas cookies nos es posible usar la estructura clave/valor para almacenar de forma segura nuestros datos y poder reutilizarlos más adelante. Actualmente, como suele ser constumbre, solo los navegadores basados en Mozilla disponen de esta característica, aunque Internet Explorer dispone de una característica similar llamada userData behavior.

Y, ¿esto que significa?

Imaginemos que tenemos una aplicación en la que enviamos mails, si estos mails son enviados al servidor, siempre que haya conexión podremos verlos, pero si estos datos además son almacenados en el cliente, aunque no tengamos conexión podremos disponer de ellas. Al igual que aplicaciones en 2 capas como Outlook, Thunderbird,… envian los datos al servidor y a la vez guardan una copia local del correo electrónico.

Un ejemplo de este proceso es halfnote, que almacena notas en el cliente y en el servidor de forma simultanea, consiguiendo una forma más segura y eficiente de mantener nuestras notas.

Este tipo de mejoras hacen posibles que aunque pierdas la conexión, no tengas por que temer en que se pierdan tus datos, una aplicación preparada podría leer esos datos y volver a cargarlos y posteriormente enviarlos de nuevo al servidor si es que tenemos conexión.

Disponemos de sessionStorage, un objeto de lectura / escritura en que podremos almacenadar datos y recuperarlos de la siguiente forma.


sessionStorage.nombre = "Pepe";
alert(sessionStorage.nombre);

Veamos además un ejemplo de como montar un sistema de recuperación en caso parada accidental del navegador.

 // Obtener el campo de texto al que vamos a seguir la pista
 var field = document.getElementById("field");

 // Ver si se tiene un valor de autoguardado
 // (esto sólo sucede si la página es actualizada accidentelmente)
 if ( sessionStorage.autosave ) {
     // Restore the contents of the text field
     field.value = sessionStorage.autosave;
 }

 // Comprobar los contenidos del campo de texto cada segundo
 setInterval(function(){
     // And save the results into the session storage object
     sessionStorage.autosave = field.value;
 }, 1000);

Además globalStorage nos permite mantener diferntes áreas en nuestros scripts. Podiendo limitar la disponibilidad de ciertos datos ciertos dominios concretos.

// Guardar datos a los que sólo pueden acceder scripts del dominio mozilla.org
globalStorage['mozilla.org'].snippet = "<b>Hello</b>, how are you?";

// Guardar algunos datos que cualquier página web de cualquier dominio puede acceder
globalStorage[''].favBrowser = "Firefox"; 

Más Información

  • Genial! Desconocía por completo esta tecnología, pero ya estoy estudiándola a fondo 😀

    Por cierto, sin ánimo de pelotear 😉 me encanta tu blog y he puesto un enlace a él en el mío. Espero que no te importe 🙂

    Saludos.

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.