HTML5 Rocks

HTML5 Rocks

HTML5 Recursos

Armazenamento

Quando os desenvolvedores da web precisam armazenar qualquer informação sobre o usuário, pensam imediatamente em fazer upload para o servidor. O HTML5 mudou isso. Agora, existem diversas tecnologias que permitem ao aplicativo salvar dados em dispositivos clientes. Os dados podem também ser sincronizados de volta para o servidor ou permanecer sempre no cliente. Isso é decisão do desenvolvedor, ou seja: sua.

Existem vários motivos para utilizar armazenamento do lado do cliente. Em primeiro lugar, você pode fazer seu aplicativo funcionar quando o usuário estiver off-line, voltando a sincronizar os dados assim que a rede estiver conectada novamente. Em segundo lugar, ele é um impulsionador de desempenho que permite a apresentação de um grande volume de dados assim que o usuário clicar em seu site, sem ter que esperar que o download seja feito novamente. Terceiro, é um modelo mais simples de programação, sem necessidade de infraestrutura de servidores. É claro que os dados ficam mais vulneráveis ​​e o usuário não pode acessá-los a partir de vários clientes. Por isso, é importante que você só use este tipo de armazenamento para dados não-críticos, em especial para versões em cache de dados que também estejam "na nuvem". Leia "Off-line": o que significa e por que eu devo me importar? (link em inglês) para obter um panorama geral das tecnologias off-line, como, por exemplo, o armazenamento do lado do cliente.

O que há de novo

Offline Technologies

  • O armazenamento na web (link em inglês) simplesmente fornece um mapeamento de valores-chave, como localStorage["name"] = username;. Infelizmente, as implementações atuais oferecem suporte apenas a mapeamentos pelo método string-to-string, então é necessário que você serialize e desserialize outras estruturas de dados. Você pode fazer isso usando JSON.stringify() e JSON.parse().
  • Base de Dados Web SQL (link em inglês) oferece a você o poder - e a realização - de um banco de dados relacional SQL estruturado.
  • Uma Base de Dados Indexada (link em inglês) é algo entre o Armazenamento na Web e Bases de Dados Web SQL. Como o Armazenamento na web, é um mapeamento por valores-chave simples, mas suporta índices como os de bancos de dados relacionais. Assim, pesquisas por objetos correspondentes a um determinado campo são rápidas, pois não é necessário percorrer manualmente cada objeto armazenado.
  • File Access é uma API para ler conteúdo em JavaScript. Dado um conjunto de arquivos que o usuário tenha adicionado a um elemento de entrada "file", você pode ler o conteúdo do arquivo ou referenciá-lo como uma URL, por exemplo, se o usuário especificar um arquivo de imagem, você pode exibi-lo. Há também propostas em curso para a criação de recursos de escrita.

Para uma comparação detalhada das técnicas de armazenamento do lado do cliente com demonstrações de código, consulte nosso artigo Armazenamento do lado do cliente (link em inglês).

Demonstrações

HTML5 Demos: Storage
Synchronization with localStorage
Timer demo

Em funcionamento

Mobile Gmail
MugTug Darkroom

Recursos