移动混合应用HTML5数据查询优化

项目介绍html

pheongap混合应用,跨平台,作应用加工厂提供应用模板编辑器~html5

本地应用,彻底是模拟IOS,安卓原生应用的实现,因此支持14种手势,全部PPT动画,视觉差效果,等等功能组合。。。sql

这是IDE的功能设置数据库

image

 

HTML5本地数据库就是用SQLite,这是咱们应用的数据库浏览器

image

 

经过数据动态生成页面缓存

这个应用有30页,有些应用上千页,因此页面全是动态生成的,只会维持在2-3页,数据结构

这里用到了模拟多线程任务 - - ,用于实现无缓冲翻页,效果仍是不错多线程

image

 

image

 

image

 


一个页面涉及N多数据的的查询,可能关联不少表,几十上百条记录,如何优化?编辑器

 

数据查询方式优化

 

1:sql数据

拼sql语句是不行的,你能够试试一条SQL语句耗费的时间是多少?  基本上1条语句就是100毫秒了,安卓下面实测

如今一个页面就可能存在几百条数据的关联,那么直接经过语句查询是行不通的

 

2:缓存哈希

经过HTML5的executeSql查询出来的是一个,SQLResultSetRowList 类型的 rows 是数据集的“行”,

rows 有两个属性:length、item ,故获取查询结果的第一行列名为name的值 :result.rows.item(0).name 

那么若是缓存数据为哈希的格式,这样就不须要查询数据了,每次找内存中的缓存便可了

就是这样

var data = {}
each(result,function(r,index){
       data[r.id] = r.item(index);
})

可是忽略一个问题,浏览器分配给每个应用的内存是有限的,因此这样缓存的表数据一多,内存会溢出,应用直接崩

 

3:缓存数据集

目前使用的就是html5返回的缓存数据集SQLResultSetRowList了,由于咱们能够直接result.rows.item(0) 经过索引下表找到对应的数据

这样只须要算出数据库中每个id对应的下标索引就能够大大加快查询数据了

 


目前项目三种都尝试过,目前使用的最后一种数据查找,项目愈来愈大,这样数据结构的问题也很严峻

若是你有作SPA应用,若是有用HTML5数据交互,但愿能帮助到你

相关文章
相关标签/搜索