最近的项目中用到了前端存储,最初选用的是localStorage,这个是html5里面新增的API,用法很简单。setItem getItem clear。 值得注意的是,localStorage中存进去的数据,都是以字符串的形式存储的,取出来的时候也是以字符串的形式拿到的。由于项目中一般数据都是以json或者array的方式存入的。因此需要在存取前进行JSON.parse和JSON.Stringify。

localStroage中另一个不便之处是,它仅仅是一个单纯的数据存储,没有自增的id。这且不说,在取数据的时候,只能遍历查找,比如你要找某一个时间段的数据,这里也只能是遍历查询。数据量少还没什么,数据量大的时候确实比较麻烦,毕竟动不动就遍历,谁受得了。

  web sql和常用的mysql有类似之处。操作的语言也是sql语句。支持一些sql常见的查找啊,增加啊 更新什么的。我觉得还比较好用,移动端应该没什么问题。但是貌似在PC上的浏览器兼容性方面会有一些问题。因为我们的项目很快找到了替代的localforage 因此web sql还没怎么过深入的研究。

  localforage是mozilla开发的,优点:1. 和localStorage一样但存取数据的时候,但可以将数组啊 json啊 等格式的数据存入,不需要再额外的改变数据格式了。另外,localStroage存取数据是同步的,而localforage则是异步的,并且支持promise模式。这一点倒不能说孰优孰劣,同步亦有同步的好处。

  localforage也是不支持sql查询的,同localStorage一样,只能做简单的数据存取,这样来看,大一些的前端数据存储,还是web sql会比较好用一些。写到这有一点疑惑,localforage是基于localStroage web sql的 怎么就不支持sql查询呢

localStorage, localforage, web sql三者的比较的更多相关文章

  1. (转)HTML5开发学习(3):本地存储之Web Sql Database

    原文:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416386.html HTML5开发学习(3):本地存储之Web Sql Data ...

  2. HTML5开发学习:本地存储Web Sql Database

       Web Sql Database,中文翻译作"本地数据库",是随着HTML5规范加入的在浏览器端运行的轻量级数据库.    在HTML5中,大大丰富了客户端本地可以存储的内容 ...

  3. HTML5 学习笔记(三)——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  4. web 存储方式汇总:Cookies,Session, Web SQL; Web Storage(LocalStorage ,SessionStorage),IndexedDB,Application Cache,Cache Storage

    1 1 1 web 存储方式汇总: 旧的方式: Cookies; Session; Web SQL; 新的方式 HTML5 : Web Storage(LocalStorage ,SessionSto ...

  5. Web持久化存储Web SQL、Local Storage、Cookies(常用)

    在浏览器客户端记录一些信息,有三种常用的Web数据持久化存储的方式,分别是Web SQL.Local Storage.Cookies. Web SQL 作为html5本地数据库,可通过一套API来操纵 ...

  6. JSP、servlet、SQL三者之间的数据传递

    JSP.servlet.SQL三者之间的数据传递 博客分类: web开发 JSPservletSQL数据库连接池web开发  前言: 最近一直在做WEB开发,现总结一下这一段时间的体会和感触. 切记, ...

  7. HTML5本地存储——Web SQL Database与indexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

  8. HTML5客户端数据存储机制Web Storage和Web SQL Database

    引言 html5本地存储可以选择两种方式,一种是本地存储,一种是sqlite. 比如开发html5的购物车功能,就可以考虑选择其中之一,进行本地存储与操作. 又或者保存用户登录信息,可以使用local ...

  9. 关于web浏览器的Web SQL和IndexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

随机推荐

  1. matlab计算差分函数diff

    A = 3 2 5 6 5 2 1 8 4 2 7 9 >> diff(A,1,1) ans = 2 0 -4 2 -1 0 6 1 >> diff(A,1,2) ans = ...

  2. Angularjs学习笔记(四)----与后端服务器通信

    一.使用$http进行XHR和JSONP请求 1.1 XHR请求 GET:$http.get(url,config) POST:$http.post(url,data,config) PUT:$htt ...

  3. 浅析jquery ui的datepicker组件

    今天计划在博客上添加一个日历,方便用户查看日期.Google了一圈,最终决定使用jquery ui的datepicker部件实现.原因有三:Datepicker使用配置比较简洁,几行代码就可以得到一个 ...

  4. R作图

    R一般的散点图:plot() 折线图:plot()   lines() 柱状图  barplot() 箱子图  boxplot() 直方图:hist() 热力图:heatmap 画地图的:拓展包  m ...

  5. AQL 对象关系图

  6. JS入门之ActiveXObject对象(转载)

    JS入门之ActiveXObject对象   此对象提供自动化对象的接口.   function ActiveXObject(ProgID : String [, location : String] ...

  7. 关于android帮助文档打开慢

    打开慢的原因是:Doc目录下的html文件里含有访问google的js文件<link rel="stylesheet"href="http://fonts.goog ...

  8. 技术英文单词贴--I

    I increase 增加,增大 individual 个人的,个别的 instead 代替 integer 整数,整形

  9. SAP 创建物料主数据分类视图特性

    1.CL01创建物料分类 2.去CT04中去创建特性值 创建完成之后保存, 3.创建物料的分类视图,选择相应的特性值

  10. yum安装出错

    [root@lxh yum.repos.d]# yum install -y samba Loaded plugins: fastestmirror, refresh-packagekit, secu ...