HTML5 Rocks

HTML5 Rocks

HTML5 Características

Almacenamiento

Cuando los desarrolladores web quieren almacenar cualquier información del usuario, piensan inmediatamente en subir datos al servidor. Sin embargo, esto ha cambiado con HTML5, ya que actualmente existen varias tecnologías que permiten que las aplicaciones almacenen datos en los dispositivos cliente. Según lo que decida el desarrollador, la información puede sincronizarse también con el servidor o permanecer siempre en el cliente.

Hay varias razones por las que puede ser recomendable utilizar el almacenamiento en el cliente. En primer lugar, el almacenamiento en el cliente permite que una aplicación funcione cuando el usuario no está conectado, posiblemente sincronizando datos cuando vuelve a establecer conexión. En segundo lugar, aumenta el rendimiento, por lo que se puede mostrar una gran cantidad de datos en cuanto el usuario hace clic en el sitio en lugar de esperar a que vuelvan a descargarse. En tercer lugar, es un modelo de programación más sencillo que no requiere infraestructura de servidor. Por supuesto, los datos son más vulnerables y el usuario no puede acceder a ellos desde varios clientes, por lo que solo se debe utilizar para datos que no sean muy importantes, concretamente en versiones almacenadas en caché de datos específicos que también se encuentren "en la nube". Para obtener información general sobre las tecnologías sin conexión, incluida la de almacenamiento en el cliente, consulta el tutorial "Offline": What does it mean and why should I care? (Sin conexión: ¿qué significa y por qué debería importarme?).

Novedades

Offline Technologies

  • El almacenamiento web simplemente proporciona una asignación de clave-valor (por ejemplo, localStorage["name"] = username;). Por desgracia, las implementaciones actuales solo admiten asignaciones de cadena a cadena, así que hay que serializar y deserializar otras estructuras de datos. Este procedimiento se puede realizar con JSON.stringify() y JSON.parse().
  • Web SQL Database te proporciona toda la potencia de una base de datos relacional SQL estructurada.
  • Indexed Database se encuentra a medio camino entre Web Storage y Web SQL Database. Al igual que Web Storage, se trata de una sencilla asignación de valores y claves, pero admite índices similares a los de las bases de datos relacionales, por lo que la búsqueda de objetos que corresponden a un campo específico es rápida. Además, no es necesario repetir la acción de forma manual en todos los objetos almacenados.
  • File Access (acceso a archivos) es un API que permite leer contenido de archivos en JavaScript. En función de un conjunto de archivos que el usuario ha añadido a un elemento de entrada "archivo", puedes leer el contenido del archivo o hacer referencia a él como una URL (por ejemplo, si el usuario ha especificado un archivo de imagen, puedes mostrar la imagen). También se están desarrollando algunas propuestas relacionadas con funciones de escritura de archivos.

Para ver una comparación detallada de las técnicas de almacenamiento del cliente con demostraciones de código, consulta el tutorial sobre el almacenamiento del cliente.

Demostraciones

HTML5 Demos: Storage
Synchronization with localStorage
Timer demo

En estado puro

Mobile Gmail
MugTug Darkroom

Recursos