Jquery mobile无疑是一个优秀的JS框架,但到现在为止,还是没有看到基于jqm在移动平台上让人眼前一亮的应用,大家都在观望,到底webApp在移动平台上的定位如何。
这个月,基于SAE提供的移动平台开发了一个在线看漫画的应用,采用jquery mobile,实际体验了一把webApp的潜力及限制。
网站地址:http://kukubird.sinaapp.com
代码地址:https://github.com/memoryboxes/kukubird
系统架构:
SERVER:sae新建一个项目,用REST接口提供server端服务(我用了python+webpy,非常简洁):
- 为前端提供漫画名称、类别、卷/话等数据
- 为前端提供漫画地址解析
- 提供用户认证,浏览历史记录
- SERVER端的漫画录入,修改是不会影响前端的,想要添加一部漫画,只要在后台加一下地址就可以了。
- 为扩展提供可能性,事实上,我们现在就是利用SERVER端的接口,写个脚本就一键将刚收录的漫画下载到本地了,目前网上不少漫画下载器就是这个道理。
- 前端的数据交互都用Ajax完成,完全是JS+CSS+HTML5完成,可以方便的用phoneGap打包。另外SAE也为移动项目提供了打包功能,什么本地环境也不用配,就可以拿到apk包及ios调试包了。
- 系统资源消耗是非常少的,server端开启memcache后,目前80个用户一天2个云豆就可以。当然图片的流量需要独立服务器支持。
热门漫画浏览:用户打开页面-->前端Ajax发送消息-->SERVER端跨域回应-->前端接受热门漫画列表-->重载pageshow事件,用listview渲染-->结束
漫画卷/话数浏览:用户点击单一漫画-->前端Ajax发送消息-->SERVER端跨域回应-->前端接受漫画卷列表-->重载pageshow事件,用listview渲染-->结束
漫画页浏览类似
这样看来,没有什么了不起的,不过是将原来动态数据请求的部分,从直接操作数据库转移到Ajax方式而已。剩下的就是稳定性和前端的表现了。就我一点点测试来看,40W条数据内,SAE负担绰绰有余。数据量变大后,只要做好索引及表拆分,sae是绝对可以胜任的。
一点经验:
- 一般一个jqm应用由几个页面组成,不同页面间需要一些数据传递,有以下两个办法:
目前的缺陷:
- 如果对应用的UI要求比较苛刻的话,基本上后期就变成了改造jqm+重写CSS+自写效果的痛苦历程,我认为jqm暂时还不能胜任。对于非前端人员,还是老老实实用默认主题好了。
总体来说,目前的JQM是可以实现一些比较简单的数据交互网站,但如果你需要UI复杂,数据量巨大的交互应用,还是得原生App,当然,像 m.oschina.net这样的资讯类应用,JQM完全可以胜任。
ps:我对于前端开发并不熟悉,javascript也只是刚学习1个月而已,以上都是个人的主观感觉,仅供参考,不当的地方还请大家拍砖。