ionic开发移动应用总结
2016-07-20 17:05
423 查看
本文不是ionic的教程,相关教程网上已经很多,本文主要是自己在采用ionic开发移动应用过程中的一些总结。
在ios,android中,对window.localStorage均有5Mb的限制,并且在手机内存紧张的情况下会清空window.localStorage。因此window.localStorage并不适合做为数据的持久化方式。
众所周知在ios以及android中均采用sqlite来存储相关数据, 除了window.localStorage,还可以采用sqlite来存储数据,具体如何使用可以参考ngCordova插件$cordovaSQLite。
另外还有LokiJS以及PouchDB,具体操作可以看http://gonehybrid.com/里的相关文章。
代码检查也是开发中必不可少的,最简单的方法是人工检查(开发人员相互检查,开发leader检查),然而这种方法效率太低,并且由于人员
疏忽,代码混乱有些错误很难检查到。
另外一种是自动化检查,写相关的检查规则,然后写脚本运行自动检查。相关教程可以参考:
http://ionichina.com/topic/54e9448f32f2c3c01929965b
代码混淆很重要。(本人之前搞android开发的,对前端js,css,html混淆不是太熟悉,也望有大牛赐教)网上找了下可以采用cordova-uglify。
端到端的测试可以采用Jasmine和Protractor。具体如何操作网上有相关教程:http://gonehybrid.com/。
1、采用crosswalk代替webview(不过采用crosswalk会增大应用包的大小),具体如何使用请教网络~~
2、针对图片进行相应处理,无论在原生还是在H5中,过多的图片都会导致应用变卡等甚至引起内存溢出。
3、页面跳转不流畅,采用延迟加载方式(lazyload)
4、尽量减少不必要的网络请求
......
目前想到这么多,后续若有再补充,也欢迎各位看官批评指教~~~
一、本地存储
某些应用信息需要存储在本地以便后面使用,最简单的本地存储是window.localStorage,我们可以将数据以键值对的形式进行存储,如下:// simple example localStorage.setItem('name', 'Pinky'); var name = localStorage.getItem('name'); console.log(name);
在ios,android中,对window.localStorage均有5Mb的限制,并且在手机内存紧张的情况下会清空window.localStorage。因此window.localStorage并不适合做为数据的持久化方式。
众所周知在ios以及android中均采用sqlite来存储相关数据, 除了window.localStorage,还可以采用sqlite来存储数据,具体如何使用可以参考ngCordova插件$cordovaSQLite。
另外还有LokiJS以及PouchDB,具体操作可以看http://gonehybrid.com/里的相关文章。
二、代码检查
人无完人,孰能无过。代码检查也是开发中必不可少的,最简单的方法是人工检查(开发人员相互检查,开发leader检查),然而这种方法效率太低,并且由于人员
疏忽,代码混乱有些错误很难检查到。
另外一种是自动化检查,写相关的检查规则,然后写脚本运行自动检查。相关教程可以参考:
http://ionichina.com/topic/54e9448f32f2c3c01929965b
三、代码混淆
采用ionic开发的应用,直接将.apk或者.ipa改为.zip即可看到应用的全部源码。作为公司肯定希望自己的应用不被破解,代码不被抄袭。因此代码混淆很重要。(本人之前搞android开发的,对前端js,css,html混淆不是太熟悉,也望有大牛赐教)网上找了下可以采用cordova-uglify。
四、测试
为了保证代码质量,作为开发者你需要对自己的代码进行单元测试,针对angularJs的前端开发单元测试框架可以采用karma和Jasmine。另外针对端到端的测试可以采用Jasmine和Protractor。具体如何操作网上有相关教程:http://gonehybrid.com/。
五、性能优化
采用H5开发的移动应用跟采用源生(如anroid或者ios)开发的移动应用相比,在性能方面有很大的差距。如何提升性能是采用H5开发移动应用必须要考虑的:1、采用crosswalk代替webview(不过采用crosswalk会增大应用包的大小),具体如何使用请教网络~~
2、针对图片进行相应处理,无论在原生还是在H5中,过多的图片都会导致应用变卡等甚至引起内存溢出。
3、页面跳转不流畅,采用延迟加载方式(lazyload)
4、尽量减少不必要的网络请求
......
目前想到这么多,后续若有再补充,也欢迎各位看官批评指教~~~
相关文章推荐
- ionic 上拉菜单(ActionSheet)实例代码
- Ionic实现页面下拉刷新(ion-refresher)功能代码
- 利用H5特性FormData实现不刷新文件上传
- 使用jQuery.wechat构建微信WEB应用
- 基于h5 ajax实现手机定位(demo)
- 基于h5的history改善ajax列表请求体验
- Ionic快速安装教程
- Ionic如何创建APP项目
- ionic js 复选框 与普通的 HTML 复选框到底有没区别
- Ionic如何实现下拉刷新与上拉加载功能
- 如何利用AngularJS打造一款简单Web应用
- Ionic实现仿通讯录点击滑动及$ionicscrolldelegate使用分析
- H5、React Native、Native应用对比分析
- 通过 Push 来提高移动应用的活跃度 3ff0
- HTML5 实现手机拍照上传
- Ionic框架入门(原文翻译)
- 20分钟轻松制作移动网站
- Ionic学习笔记
- 致全体51CTO博主:洛阳亲友如相问,就说你在手机里