移动混合开发.pdfVIP

西涛 offbye@ /offbye 2014年3月  概念  与桌面开发的异同  争议  常见踩坑点  常用工具介绍 ◦ 调试工具 ◦ Cordova/PhoneGap框架 ◦ Ionic、AngularJS框架  Hybrid App架构实践  项目选用的js框架和项目总结  Web Application  App ：应用程序 ◦ 完成某项或者几项任务 ◦ 满足某些需求  Web ：构建于Web技术之上 ◦ HTML/CSS/JS ◦ 服务端  形态 ◦ Web ◦ 纯WebApp ◦ Hybrid App  同 ◦ 技术范畴基本相同 ◦ 大部分经验可以迁移  异 ◦ 不同载体上的特殊问题 ◦ 性能 ◦ 库和框架  HTML/CSS/JS ◦ DOM/BOM/…  服务端 ◦ WebServer/PHP/…  主要针对浏览器 ◦ 浏览器兼容问题 ◦ Android碎片化，不同的android版本，分辨率。。。  架构经验 ◦ 展现与逻辑分离 ◦ 模板引擎 ◦ 各种优化  代码层面的经验 ◦ 模块化 ◦ 模板编译 ◦ 代码混淆  与服务端交互数据 ◦ 使用JSON格式 ◦ Ajax/JSONP ◦ JSONP即JSON with Padding。由于同源策略的限制， XmlHttpRequest只允许请求当前源（域名、协议、端口）的资源。 如果要进行跨域请求， 我们可以通过使用html的script标记来进 行跨域请求，并在响应中返回要执行的script代码，其中可以直接 使用JSON传递javascript对象。 这种跨域的通讯方式称为JSONP。 具体参考 /chopper/archive/2012/03/24/2403 945.html  移动设备屏幕 ◦ 屏幕偏小，ViewPort概念受到空前关注 ◦ 布局pixel与物理pixel不一定相等  操作方式 ◦ 不能依赖鼠标悬浮 ◦ 触摸控制精度低于鼠标控制 ◦ 触屏设备（通常）没有物理键盘  SunSpider  IE8(on XP) ：6000ms  iPhone 4S ：2200ms （2.7 times faster ）  但是  Chrome(on XP) ：350ms  iPhone 4S ：2200ms （6.3 times slower ）  与此同时  iPhone 4S ：2200ms  Nexus One ：5400ms （2.5 times slower ）  顶级手机性能不输桌面平均水平  高端和低端性能差异巨大 ◦ 手机更新换代速度也非常快  手机上不适合用setInterval做动画  幸哉 ◦ iOS和Android平台都以webkit为主 ◦ CSS 3 Transition/Animation可用 ◦ 半透明、阴影、圆角、渐变都可以用  悲哉 ◦ CSS 3动画在低端手机上的丢帧现象 ◦ CSS 3效果对性能要求不低 ◦ 同期设备iOS浏览器性能明显高于Android  但国内（搜索）市场上Android流量高于iOS 1. 用HTML5的离线存储和本地存储进行缓存，或者将页面 直接打包到客户端中，减少在网络下载中的耗时。 2. 减少DOM数量，尽可能少的使用position:relative，减 少对DOM的操作 3. 用CSS动画代替JS动画，在Android平台上可以平稳退化， 放弃动画效果(包括CSS3动画) 4.