HTML5 y sus tipos de almacenamiento

EducacionIT

26 enero, 2015

Cada día que pasa se utilizan más las capacidades de HTML5, y entre ellas, quizás una de las más necesarias es el uso de algún tipo de almacenamiento local que permita reducir de forma significativa las peticiones al servidor para recibir datos. Pasamos a comentar las distintas opciones que hay.

Data Atributos: Este tipo de almacenamiento es el más sencillo y quizás uno de los más flexibles y permite almacenar en atributos «data» de nuestras etiquetas HTML pequeños bloques de información.

SessionStorage: Este tipo de almacenamiento nos permite almacenar pares de clave/valor a nivel local y ligados a la ventana que el usuario tiene abierta en ese momento. Una vez cerrada los datos se perderán.

LocalStorage: Este tipo de almacenamiento nos permite almacenar pares de clave/valor a nivel local pero que perduran en el tiempo aunque el usuario cierra la ventana o el navegador.

WebSQL Database: HTML5 nos permite almacenar en una base de datos local al navegador información con una estructura de tablas utilizando SQL. Hay que andarse con ojo ya que aunque los navegadores lo soportan el standard ha sido deprecado.

IndexDB storage: HTML5 nos permite también almacenar en una base de datos local NoSQL la información que necesitemos utilizando objetos de Javascript.

FileSystem API: El API de HTML5 que nos permite almacenar ficheros binarios de forma local. Nos puede ser útil en muchas casuísticas como por ejemplo almacenar video o audio de forma local para posterior reproducción.

OffLine Page/Application Cache: Por último las nuevas capacidades de HTML5 permiten definir políticas de «cache» con todo el contenido que nos descargamos de tal forma que si en algún momento parte de este contenido no esta disponible o queremos simplemente acceder de una forma más rápida podamos acceder a él desde la cache.

HTML5 y soporte de navegadores

Como siempre el tema del soporte es crítico y la pagina de caniuse puede ayudar a solventar las dudas. Hoy en día los data atributos, LocalStorage, SessionStorage, Application Cache y FileAPI están soportados por prácticamente todos los navegadores modernos. Por el otro lado, el soporte de Web SQL e IndexDB es parcial. Mientras que Web SQL poco a poco entrará en desuso el soporte de IndexDB irá a más.