网易摄影推出html5开发的iPad APP

网易摄影精选是网易摄影（http://pp.163.com/）出品的第一款基于html5开发的ipad应用，聚焦于用户浏览美图时的体验，崇尚极简主义的设计，一切皆为用户看到自己喜欢的高清美图而服务。没有复杂的功能，用户不需要注册、填写任何信息就能使用。

[技术解析]

网易摄影精选采用目前比较流行的混搭模式（native+web）开发，native层选用phonegap开源框架用来提供web层对设备功能的支持，web层基于网易自主研发的前端开发框架用来实现页面布局及业务逻辑，应用对部分HTML5/CSS3技术做了实践，整个应用大小只有500K左右。

1. 离线数据缓存

考虑到移动设备流量的宝贵性及离线的可访问性，网易摄影精选使用HTML5中本地缓存API将用户访问过的数据保存在客户端，因此用户在离线的情况下可以继续查看上一次浏览过的信息，在联网的情况下用户可以通过手动刷新的方式更新数据。

2.  触摸手势

由于移动设备对页面上的点击事件会有一定的延迟，网易摄影精选用户操作使用了框架提供的自定义点击事件来提高操作的响应速度。

框架对移动设备上的手势做了更好的支持，支持常规的如滑动、挤捏等手势，在网易摄影精选中也有具体应用

3.  模拟滚动条

由于大部分移动平台都不支持节点的overflow:scroll的样式，因此框架也为具体应用提供了模拟滚动条，这在网易摄影精选中也有多处应用，并获得接近native的效果及流畅的性能体验。

4.  CSS3应用

IOS平台浏览器内核对CSS3属性有着非常好的支持，网易摄影精选大量使用了圆角、阴影、渐变、动画等CSS3新特性，减少图片资源的应用，因此整个应用的大小得到极大的优化。

 

另外，网易摄影精选应用在开发过程中也碰到很多问题，如IOS 4.x上出现动画闪烁、应用退出等问题，通过实践得出的一些开发建议如尽量减少动画播放过程中对页面上的DOM操作、尽量避免使用阴影效果的虚化度、在低版本设备上尽量避免太多动画叠加、对应用的内存管理上的实践包括如动态控制大图页的图片加载（防止用户在快速拨动的过程中、下载大量图片）、控制大图节点的分配和回收（在大图拨动的过程中，只保存当前图片的前一张和下一张）等。