Una de las cosas que podemos (o vamos a poder hacer) con los navegadores, una vez que estos implementen HTML5 (y anexos) es acceder a la caché local del navegador con HTML5. De esta forma podremos almacenar información de forma persistente, a lo largo de toda la sesión de un usuario y lo mejor de todo, no será en el servidor, si no que será en el navegador. Lo cual nos va a permitir dotar de funcionalidad offline a nuestras aplicaciones.
Algunas cosas que tienes que saber de la caché local o Local Storage son:
- Que esta tecnología viene a sustituir a las cookies en la faceta de persistir información
- La vida de los datos durará mientras el usuario no cierre la ventana
- El tamaño de os datos que puedes almacenar en la caché variará entre 5Mb y 10Mb
- Que los datos se guardarán asociados al dominio
Lo primero que haremos en nuestro código será comprobar que existe el elemento localStorage
, y por lo tanto tenemos acceso a la caché local. Así nos aseguramos que el navegador en el que se está ejecutando nuestro código tiene soporte para el elemento localStorage
.
if (localStorage) // Existe la caché else // No existe la caché
En el caso que exista la caché podemos acceder a ella mediante el objeto localStorage
de dos formas. En un primer lugar podremos almacenar información en la caché mediante las siguientes sentencias:
localStorage.setItem("nombre","victor"); localStorage["nombre"] = "Victor";
Y para recuperar la información de la caché será muy parecido y lo realizaremos de la siguiente forma:
document.write(localStorage.getItem("nombre")); document.write(localStorage["nombre"]);
Con estas pocas sentencias ya podremos acceder a la caché local del navegador con HTML5 y aprovechar todas las capacidades que nos ofrece.