基于Web前端的localStorage性能研究与改进

【摘要】互联网蓬勃发展，它已然拥有极高的用户占有率；同时，互联网技术也不断更新换代，如桌面技术一样，互联网技术已然走向更加细致化、专业化的道路，Web前端也逐渐独立为一门独当一面的专业技术，越来越为人们所重视与关注。近年来国内外针对Web前端的研究也逐年增多，对Web前端的性能也更加关注，特别是移动互联网用户的爆发式增长与移动端硬件性能的限制，更促使Web前端性能的研究更加紧迫针对Web前端的性能研究，在国外有著名的YSlow原则，在国内百度、淘宝等公司也专门设立的研究部门。随着HTML5新标准的发布与执行，Web前端技术趋向于规范化，新标准为Web前端的性能改进提供了新的思路与方向。依据传统的Web前端性能优化方法，减少HTTP请求数、网站总大小与资源总数目能够明显的改善Web前端性能，使用浏览器缓存、Cookie等对页面资源进行缓存能够得到更加良好的效果。针对传统的通过本地缓存进行优化的方案，使用HTML5新标准的localStorage技术能够得到更佳的效果。现有的localStorage存储技术虽然在一定程度上能够很好的改进Web前端的性能，但是由于localStorage是同步执行的操作，它的执行会阻塞浏览器UI渲染以及后续JavaScript代码的执行，所以本文针对localStorage本身的访问效率进行了研究。经过本文的测试可以发现其具有以下问题：（1）使用localStorage提供的标准接口和下标的形式获取、存储数据的效率不同；（2）频繁访问大量小数据比一次性读取大量数据的性能低很多；（3）localStorage同一个域空间上限的各个浏览器不一致造成抛出错误导致程序终止。针对上述测试的localStorage已有问题，本文从Web前端开发的角度提出了改进方案：（1）针对调用方式的性能差异，本文通过在原有localStorage提供的接口基础上封装新的统一接口，从而限制用户对接口的调用；（2）针对大量小数据频繁读取的性能问题，本文设计新的存储访问格式与更加灵活的访问方式，并设计了一次性访问的完善机制；（3）针对localStorage的空间上限问题，本文将空间上限的控制划分为两个方面，从应用的角度限制存储数据条数的上限，从程序的角度检测空间上限，根据LRU算法自动清除过去的数据信息以便顺利写入新的数据，而不致于浏览器自动清空全部数据。本文的实验部分通过三个实验分别证明了大量访问小数据改进方案性能的优越性（1）频繁读取大量小数据，文章通过使用与localStorage性能测试相同的测试数据对其进行测试，形成性能对比图，可以看到本文的改进方案的改进性能比传统方案至少提高四倍，证明了改进方案的良好表现；（2）写入数据超过应用配置上限但不超过浏览器上限，通过分步写入数据查看localStorage内容结果，同时验证LRU算法实现的正确性，解决了应用上的空间上限问题；（3）写入数据不超过应用配置上限但超过浏览器上限，结果显示本方案对浏览器抛出的错误进行了良好的处理并正确的对数据进行了清理，从而释放了空间，解决了程序上的localStorage超过空间上限抛出错误的问题。
【作者】周璐；
【导师】房至一；
【作者基本信息】吉林大学，计算机技术，2014，硕士
【关键词】localStorage；Web前端；性能优化；HTML5；

【参考文献】
[1]李凯.含N、O配体在合成环状配合物中的应用研究[D].北京理工大学,化学工程与技术,2014,硕士.
[2]姚在斌.公平敏感性视角下成都中小饭店员工忠诚度影响因素实证研究[D].成都理工大学,旅游管理,2013,硕士.
[3]张伟.不完备决策表模型扩展和属性约简算法[D].广西师范大学,计算机软件与理论,2013,硕士.
[4]肖桂华.吴朝晖——提升高校创新和产学研合作水平[J].中国科技产业,2014,02:55.
[5]张娜.159例弥漫大B细胞淋巴瘤的预后分析[D].大连医科大学,肿瘤学,2012,硕士.
[6]吴波前.列车追踪接近预警系统车载设备优化设计[D].北京交通大学,2014.
[7]陈兰云.福斯特叙事策略中的女性主义倾向[D].河北师范大学,英语语言文学,2012,硕士.
[8]郎素平.生存树方法及其在预后分析中的应用[D].山西医科大学,流行病与卫生统计学,2003,硕士.
[9]鲍学俊.梅雨过程及其与环流关系的初步研究[D].南京气象学院,气象学,2004,硕士.
[10]刘军.企业发展中营销创新之研究[D].新疆大学,工商管理,2013,硕士.
[11]林亮.厦门技术经纪人的现状及发展对策研究[D].华侨大学,项目管理（专业学位）,2014,硕士.
[12]黄学明.耳尖放血配合针刺治疗特发性面神经麻痹临床研究[D].广州中医药大学,针灸推拿学,2013,硕士.
[13]刘海雷.农产品加工业监测分析与预警系统动态报表的设计与实现[D].北京邮电大学,物流工程（专业学位）,2013,硕士.
[14]魏敏.梅特涅尔童话奏鸣曲及其作品OP.25 NO.1分析研究[D].天津音乐学院,音乐表演,2013,硕士.
[15]刘石磊.基于可信代理的访问控制模型研究[D].河北大学,计算机系统结构,2014,硕士.
[16]王亮亮.有机电致发光器件寿命测试驱动电路的研究及装置设计[D].南京邮电大学,光学工程（专业学位）,2013,硕士.
[17]李玉增.硅材料科学与工程的现状及我国的对策[J].科技导报.1993(11)
[18]王明伟.高温合金和钛合金真空热处理及热胀形过程数值模拟[D].大连理工大学,2007.
[19]曾恒.流形学习在高速列车安全性态评估数据分析中的应用[D].西南交通大学,电气系统控制与信息技术,2013,硕士.
[20]王迪.商业信托中信托财产的法律地位研究[D].华东政法学院,法律,2003,硕士.
[21]管伟娜.论不得强迫自证其罪原则[D].河北大学,诉讼法学,2014,硕士.
[22]白永飞.降水量季节分配对克氏针茅草原群落初级生产力的影响[J].植物生态学报,1999,02:60-65.
[23]高倩.外商投资企业股权转让中的行政审批与合同效力研究[D].吉林财经大学,法学,2014,硕士.
[24]李栋.东营市政法机关社会管理创新问题研究[D].山东师范大学,公共管理（专业学位）,2013,硕士.
[25]郭慧骏.中美新闻发言人答记者问中语用模糊的对比研究[D].山西财经大学,外国语言学及应用语言学,2014,硕士.
[26]王懿.磨牙半切术后修复治疗的三维有限元分析[D].第四军医大学,口腔临床医学,2004,硕士.
[27]刘健,崔建中,顾海勇.一组适合于农网的新颖馈线自动化方案[J].电力系统自动化,2005,11:82-86.
[28]赵聪.都市文明中的“荒野”—残雪小说论[D].湖南大学,中国语言文学,2012,硕士.
[29]刘业政.基于粗糙集数据分析的智能决策支持系统研究[D].合肥工业大学,2002.
[30]顾乡.大跨度小半径连续弯梁桥结构行为分析[D].西南交通大学,桥梁与隧道工程,2012,硕士.
[31]郑磊.基于静态一般均衡模型的我国近年来通胀成因研究[D].西北师范大学,统计学,2013,硕士.
[32]郭宗福.鲁能泰山公司电缆业务营销创新及实施研究[D].大连理工大学,工商管理,2003,硕士.
[33]王峰.自动喷水—泡沫联用灭火系统关键部件的设计与研究[D].上海海洋大学,机械设计及理论,2014,硕士.
[34]周慧.解决商务英语词汇课堂教学的问题[D].广东外语外贸大学,商务英语研究,2013,硕士.
[35]杨远.基于Wells-Dawson型多金属氧酸盐杂化化合物的合成、结构及性质研究[D].东北师范大学,无机化学,2012,硕士.
[36]郝红红,陈浚,程鳌,陈建孟.一株好氧反硝化菌的筛选鉴定及固定化研究[J].环境科学学报,2013,11:3017-3024.
[37]林楚镖.淘宝网网店电子服务质量评价体系设计[D].兰州大学,工商管理（专业学位）,2013,硕士.
[38]刘萌.电动汽车动力系统仿真技术研究[D].山东大学,动力机械及工程,2013,硕士.
[39]周鹏程.一种改进的无线传感器网络加权质心定位算法研究[D].湖南大学,计算机技术,2011,硕士.
[40]王禹心.我国新型农村合作医疗制度的发展问题研究[D].东北师范大学,社会保障学,2012,硕士.
[41]张宇.基于”双峰”时效热处理的氢对7075铝合金力学行为影响的研究[J].热加工工艺,2015,06:159-161.
[42]杜明.基于Copula函数的债市相关性与风险价值分析[D].天津财经大学,国民经济学,2012,硕士.
[43]张建生,李旭东,陈众,孙建鹏,刘华成.模拟尾流气泡幕中的气泡率及声速[J].西安工业大学学报,2014,01:16-21.
[44]胡晓洁.大理州初中生健康危险行为调查[D].大理学院,流行病与卫生统计学,2013,硕士.
[45]靳永欣.集成电路芯片封装的热—结构数值模拟分析及优化设计[D].大连理工大学,工程力学,2004,硕士.
[46]吕莉,张敏,杨立芹,羊新胜,赵勇.拓扑绝缘体Bi_2Se_3单晶体的研究进展[J].材料导报,2013,11:7-12.
[47]韦敬土.融合蛋白hLY-hbFGF的真核表达及活性初步评价[D].江南大学,微生物与生化药学,2012,硕士.
[48]胡媛.泰国职业高中汉语教学现状分析与对策[D].华中科技大学,汉语国际教育,2013,硕士.
[49]朱丹红.现代汉语歧义关系小句研究[D].东北师范大学,汉语言文字学,2012,硕士.
[50]张友梅.正广义系统的结构性质研究[D].东北大学,运筹学与控制论,2010,硕士.