最近在开发无线js代码库，拿到了Android测试机N1，这几天的测试过程中，发现了Android2.2里chrome lite的一些问题，记录在本文最后。

试用过Andorid浏览不同的网页后觉得，移动web开发应该尽量避免类似桌面应用那样的富客户端体验，因为本身各种手机性能参差不齐，而且性能最好的iPhone4也并没有好到哪里去。桌面的IE6虽然比chrome性能差几十倍，但在强大的桌面硬件支持下普通富客户端应用差别很小，甚至感觉不出来，但手机上就不一样，差别明显，性能低到无法忍受。

我在Android下试了sencha/jqtouch/jquery mobile，体验都不好，很卡很慢，如果只是针对iOS平台的浏览器还好，如果是针对所有平台的，还是不要用这么复杂的框架。速度快是最重要的体验元素，这在移动web上主要表现在渲染的速度。而一些锦上添花的效果有时不仅影响速度，还会有更差的体验出现，例如jquery mobile在滑动切换页面时会不断调整位置，或者隐藏显示地址栏，导致页面闪了几下，体验不太好。

做移动web开发，我目前想法是：

1. 最重要的是写好css让页面显示适应屏幕，但同时CSS3带来的特殊效果尽量少用，特别是list的渐变背景最好不用，会拖慢页面的渲染。
2. 少用或不用动画，虽然css3动画在iOS上表现不俗，但至少在Android上表现不佳，很卡的动画比没有动画效果更差。
3. 功能性的交互可以多（如dom切换/ajax，但要极力优化），效果性的交互尽量少（例如手指拖动元素，slider等组件）。

如果要在手持设备上有足够丰富的交互体验，还是做原生APP靠谱。如果不考虑各种浏览器的兼容，只考虑iOS，那能做的事还是挺多的，感觉sencha touch就只是为iOS准备的。但在iOS上浏览器的性能也无法跟原生APP比，差得很远，而且如果只支持iOS，web失去了跨平台这个特性，也就没多大意义了。

附：Android2.2浏览器的问题

触摸屏

1. touchmove触发次数太少
   表现在两个方面：
   Ⅰ.拉住页面拖动的时候，触发touchmove事件的次数比ios少了一两倍。
   Ⅱ.手指滑动速度太快（像翻页那样）时touchmove几乎不触发，或只出发一两次。ios上会出发很多次。
2. 在某一个元素侦听touch事件，如果两次touchstart间隔时间太短，touch事件就不再作用到那个元素上，穿越了这个元素直接作用在页面上。这个问题在touchstart时preventDefault可以解决。

总的来说就是，触摸不灵敏。

渲染

1. 页面上用CSS3渐变时，特别是全屏背景颜色渐变，渲染会变慢很多，拖动会变得很卡。
2. 有些渐变颜色在页面移动过程质量会变低。

事件

1. 不支持gesture事件，可以理解为因为很多android手机多点触摸功能很差，直接把这个功能干掉了。
2. Android2.1以下不支持orientationchange事件，需要用resize事件模拟。我测试的N1 Android2.2支持这个事件。
3. Android2.2的浏览器支持position:fixed这个css属性，2.1以下版本支持情况不明。它viewport的概念跟iOS mobile safari是不一样的。