【电脑】iPhone Web App开发杂感

iPhone的SDK还需要两个月才出来……现在要给iPhone开发app的话，唯一的官方推荐方式就是走web app的道路……

水果牌的魅力无穷……即便有browser的局限，还是有不少精彩的iphone web app浮现……

Facebook的iPhone版本，简直就做得跟原生程序无异……当之无愧的Best iPhone Web App……

这或许也是iPhone上的Mobile Safari够强……它真的很强悍……现代浏览器该支持的它都有……若要挑剔的话，我可以说它js的执行速度太慢……但这是处理器的问题，非战之罪……

只要有足够想象足够技术，iPhone能够提供一个相当美好的舞台……而Google的手机平台Adroid使用的浏览器与iPhone亦是同核心……明年底，GPhone出来后，iPhone Web App应该都能够摇身一变成为GPhone Web App才对……

手机原生程序固然可以享受到各种Web App无法做到的东西……比方说3D，本地储存等等……但这是有代价的……Windows Mobile / Sybiam / iPhone / Adroid，难道我们需要维护四个程序版本？而Web App的话，相信未来几年内就能够将他们全部一网打尽……

浏览器内的世界已经可以很精彩了……偶个人对Web App的发展还是非常有信心的……

扯远了……

开发iPhone Web App时，偶大部分的时间都是十分开心……因为我只需要照顾好MobileSafari一个浏览器就够了……我可以毫不犹豫的使用-webkit-border-image这样酷的CSS效果……

但MobileSafari也是有bug的……最纳闷的一个CSS bug就是它无法在页面上固定位置显示一个东西……比方说菜单……而偏偏在页面上显示固定元素做导航在iPhone上面对用户交互是十分关键的……CSS搞不定，javascript呢？很悲惨的是用户拖动页面这个事件根本拿不到……应该有别的js奇技可以搞定这个……但是，这个是bug……相信这个bug会水果牌会很快搞定的……我个人是觉得投入精力去绕过这么个bug很划不来……至少，facebook也没有……

facebook是家伟大的公司……它的iPhone版很酷……而其开发者Joe Hewitt（不认识？Firebug作者是也！）把facebook iPhone版页面切换引擎iui给开源了……iui很好，很强大~ :P

因为开发的web app包括IM，使用AJAX是必然的了……实际上，偶使用了超大量的Ajax……

在选择Ajax库的时候，着实费了一番功夫……最终是选择了jQuery……主要原因是在普通web上用惯了……转其他库的话，重新上手需要时间……

一开始犹豫主要是担心jQuery太庞大……怕iPhone抗不住……可实际测试的结果……MobilSafari运行jQuery游刃有余……

另一方面的衡量是对于OO的支持……jQuery代表的是Event Base的开发哲学……OO并不是jQuery的选择……这点在jQuery作者John Resig的一个演讲中有提到……

偶的Web App相对比较复杂……不遵循OO的话， 很担心代码后期的维护以及扩展……不过后来也就释然了……不是非OO不可……代码好坏最重要的还是看程序员本身的功力……如果说OO是神刀的话……有的人“即便有神刀在手，亦无法成为刀中之神”……而且，也不是说用了jQuery就不能OO……我完全可以从别的库如Prototype / Mootools等挖出他们对OO支持的部分来用……至于$，还是觉得jQuery的爽~

如果不是jQuery用惯了的话，我很可能会选择mootools……因为它够轻量……

号称对iPhone有特别支持的js库是Dojo……而Dojo亦对Comet有支持……Cometd便是Dojo基金会那伙人搞出来的……偶做的Web App有包含Web IM，本来看上去Dojo会是合适的选择……但最终还是放弃了……它太庞大了……如果我用上Dojo的话，可能以后所有的东西都得基于Dojo……就算服务器端不用它的Cometd，我还是需要去使用使用它的bayeux协议……bayeux协议看了就很晕……这条贼船太大……上去了就下不来……所以，Dojo反倒是偶最先排除的js库……

不算UI设计……整个Web App开发了大概是2个人月……但，优化、修改又用去2.5个人月……

iPhone跑JS是很慢的……虽然开发的时候已经有小心注意效率……但第一版出来的结果不理想……主要原因是大家第一次做这么复杂的Web App，欠缺经验……所以，狠下一番功夫去做优化，若干模块几乎就是重写了……

jQuery的$对CSS selector是很强悍……但是功能强大并不代表它快……一开始做的时候甚至有时select了一堆Element出来，然后使用each……慢就一个字……后来全部另外想方法重写了……效率前后相差可达数十倍……

在UI上，则是开心了使用了iui……iui跟jQuery共存得很好……

它的可显示面积最多只有320x396……然后，还有横屏、竖屏……MobileSafari地址栏显示、隐藏……输入键盘打开、关闭……设计时必须考虑到这种种情况……如果说要在用户输入时做动态提示……那么需要记得用户输入的时候键盘是打开的，千万不要把提示放在被键盘盖住的地方……

纯手指触摸屏操作……这意味着屏幕上的所有可点击元素（按钮等）都必须够大，最好还要相隔够远……一行最好只有一个……不然，用户很容易点错……

当然，我们也可以完全选择按照iPhone它自己的UI风格去做……顶部一个标题，标题旁最多两个按钮……然后正式内容再采用那个List风格……但问题是，iPhone本身有一个Home按钮可以用……Web App没有，Home一按，就直接退出Safari了……另一个关键问题是MobileSafari的页面滚动默认是整个页面的滚动……你无法让用户只滚动页面中的一个Div/iframe，而保持其他部分不动……（Well，实际上，是可以只滚动一个Div，只是需要用两个手指！）……

这就意味如果Web App够复杂（比方说偶开发的这个），就不能照搬Apple的风格了……

总的来说，开发iPhone Web App是件很有挑战性，也可以是很惬意的事情……Web + 手机是当下以及下来一两年内最热门的开发话题……时势如此，英雄又是在哪里呢？

czp 在 5/10/2008 3:25:29 PM 说:

iPhone Web App开发并不难，可是却不多。。从iPhone 上网导航网站http://www.iwebnav.com看 ， 据说囊括了国内的所有优秀支持iPhone的网站，也不到100个呢。

---

整天折腾的问天 在 1/16/2008 10:54:33 AM 说:

jQuery使用的表达式是CSS标准的选择表达式……
很值得花功夫去研习……
这样子，对css水平提高也是有帮助……

---

a79v 在 1/16/2008 3:37:16 AM 说:

hehe,我也用jquery,彪悍的说,不过有时候他的那个表达方式还是有点不太熟悉1-_-,上次一个option就不知道怎么找，后来火了，干脆getbyid,不过jquery的ajax library和那些effect还是很方便的~oo貌似不一定要写成class的说，drupal就一个class也没有，不过也有oo得优点.

---

wkw 在 12/30/2007 2:43:24 PM 说:

这篇看不懂但知道与工作有关

---

猫 在 12/30/2007 5:37:40 AM 说:

沙个发先~
真是……太专业了……看不懂-__-
多写点关于ipod touch的东东吧，感兴趣：）

---