首先在写这篇文章前,必须先申明一下,本人是技术出身,对HTML技术及手机客户端都有过编程经验,只是出于工作岗位的变动,便没有再具体代码工作,以下文章涉及的中间件的基本代码实现及前期的API使用,都是自己测试过的,虽然比较浅,但是都是真真实实的。所以请各大网友拍砖,手下留情哦~另外本文的视角如文章标题一样, 是从产品经理的角度去做比较的,不是从技术方面上去做比较。

AD:

而关于原生态的开发,个人觉得HTML5中间件或者混合原生的方式肯定是不用做比较的,毕竟原生的东西还是很强大的,很多效果是HTML5无法比拟的,但是请确认你要做的产品是要炫?还是实用?好吧,入正文啦。

记得第一次接触PhoneGap,是在2011年5、6月份左右的时候,当初寻找这类HTML5中间件或者说HTML5平台的初衷是为了能快速推出iPhone及Android等智能手机客户端;至于为什么需要这类HTML5中间件呢?我们是出自这样的考虑:

  • 由于公司资源的分配问题,原生态开发组已经肩负太多的项目,等待原生态组团队明显不能满足我们急切要推出智能端的要求;而现有团队都是做WEB开发的,显然对于HTML这个团队是比较熟悉的,而且这样的学习成本也是相当的小;
  • HTML5跨平台的特性,一次编译,run Anywhere.只要一套html5程序代码,经过中间件的编译就可以在iPhone、Android及Symbian,还有Windows Phone 上运行,明显这个是开发成本及时间成本上可以大大的节省;
  • 用户体验性能如何,能否给用户提供流畅的用户体验;

在满足了这些条件及经过一周时间的选型之后,公司决定选择了PhoneGap平台(中间也分析过其他中间件平台如:Titanium、Sencha Touch等,但都不是很理想),接下来就是苦逼的开发鸟~

由于前期在HTML5平台的使用上欠缺经验,所以在前期做选型的时候没有用很具体的业务逻辑去做性能测试,结果到了开发的中间过程,发现PhoneGap的整体性能太差了,点击一个事件都要等半天,启动页面也很慢,切换页面也是相当的慢,最终我们的产品连页面件的切换动作都不敢用…但是已经在研发进程中了,此时再改方案似乎也没有好的平台选择,也无法保证产品进度鸟,最终我们做出了这样的技术优化:

  • 页面的js库,采用自己的JS库,没有采用Jquery mobile,以加快加载速度;
  • 采用本地HTML界面模版方式做数据缓存,以减少数据请求次数;
  • 修改了PhoneGap源代码,优化启动界面及部分接口,如地图定位接口;

最终产品如期推出,可是性能方面上只能说是差强人意啊,至于体验,我想到了目前流行的一句话我想说“我能讲脏话吗?”“不行”“那我没什么好说啦!!!”

其实当初也大体知道PhoneGap在性能方面上表现差强人意,可是我们是这么期望的,在我们产品的开发过程中,应该会得到改善,而事实证明这个期望让我们承担了太多的风险;

之后,我们也试过了采用Sencha来实现,表现也是一般,所以对于HTML5中间件的性能表现,我们都不抱希望了,虽然说对这个方向一直都是看好的,可是一直都没有很好的中间件能解决这个性能问题;这个状态一直持续到今年的3月份的一天,在36Kr网站上得知了AppCan这个产品在做内测,所以很快就申请了内测,进行了试用;

一开始我试用的是采用Web模式,将http://www.8000.cn的网址编译成APK包做测试,发现好像整体启动速度及性能表现还可以;出于上次的经验,我再测试了AppCan所谓的Easy模式,随便搞了新闻类的编译了一下,感觉这东西好像还不错哦,效率应该可以挺高的,可是Symbian版本就实在难以接受鸟,下载后一大段时间白屏,然后还要再下载一个AppCan核心插件,最终直接关闭程序,无视Symbian版本;然后便安排了技术人员做深入的了解及实验,包括从API接口,性能及支持方面进行详细的研究;

研发团队经过了2周的时间的代码实现,出了一个公司产品的Demo版,在经过大多数相关人员的使用过后,感觉性能比PhoneGap实现的确实改进了不少,比如说页面的切换特效还挺顺畅的,一些公共插件及接口都比较全面,如Jabber通讯、二维码扫描、支付宝等;可是致命的一个问题是:点击触发某个事件的时候,还是可以感觉‘顿’一下的等待,让人有点不爽,最终这个问题也顺利得到了解决,原因是onclick事件的响应没有ontouchstart事件来得快,两者相差了0.5s这个数量级,实在无语AppCan这样的重要体验,都没有文档说明。

下面表格是PhoneGap与AppCan综合对比表:

PhoneGap与AppCan综合对比表
备注  PhoneGap  AppCan 备注
整体表现性能
  • 启动慢
  • 页面切换响应慢
  • 数据请求慢
  • 启动速度快
  • 页面切换相应速度不错
  • 数据请求较快
 
多窗口支持与动画 不支持 支持多窗口及native平台自身的窗口间动画

在整体UI上,PhoneGap自始至终只存在一个窗口,也就是所有的网页都运行在这个窗口当中的,这也就使得用PhoneGap写出来的应用失去了很多native应用的原生特性。

AppCan采用Window的理念来划分窗口。每个window独立存在,可以相互跳转,并且可以指定一个跳转时的过渡动画效果,如此一来,用户体验效果就非常接近native应用了,并且不存在影响效率的问题

Native UI支持 支持,开发者自己打补丁 支持并且有系统的NativeUI扩展

PhoneGap没有一套完整的native UI架构,所有UI完全依靠HTML和CSS完成。手机上的webkit存在IFrame不支持height属性,css样式不支持z- index,position,overflow等属性的硬伤,也就是页面的区域滚动在正常网页布局下是无法做到的,只能依赖JS或者native UI。

不幸的是PhoneGap把这个问题留给了开发者,开发者只能选择JS。在页面滚动上用JS效率是相当低的,尤其在android的中低端手机上表现更为 明显。 而AppCan则采用html + native的布局方式(开发者同样写JS即可做到),很好的解决了这个问题,在页面滚动的表现上,与native应用没有任何差别。

API接口
  • 本地化接口丰富
  • 支持可扩展(非常有利于定制功能)
  • 本地化接口非常丰富
  • 官方提供了很多第三方插件,省去不少开发时间
 
开发环境 无标准的IDE及模拟器,不同平台的开发要求安装不同的开发环境 一套完整的开发环境,IDE为标准的Eclipe插件,支持智能提醒,自动补齐,代码自动生成,模拟器为标准的Chrome扩展插件,支持单步调试,Log输出等  
文档说明
  • 比较详细
  • 唯一缺点,是鸟文
  • 比较少,一些文档缺失,很多描述表达也不完善,造成很多开发者很难入手
  • 国文文档,哈哈哈
 
开源及是否收费
  • 开源
  • 免费
  • 目前不开源
  • 免费
开源及是否收费问题,一直是很多开发者担心的问题,怕有一天AppCan就收费了,其实AppCan官方已经承诺会永久免费,另外一般国内优秀的产品是不会开源的,而选择开源可能就证明其在走下坡路鸟;
技术支持 基本上很难得到技术支持的相应,每次邮件都是苦逼的等待
  • 国内团队支持,沟通无障碍
  • 支持力度还不错
  • 还有官方论坛提供解决渠道
 
开源及是否收费 可以正常上线 可以正常上线  

综合来看最终还是感谢AppCan这个产品,虽然有些地方还需要完善,但的确做得挺棒的,基本满足了我们产品研发的需求。PhoneGap作为较早进入国内的HTML5中间件知名度较高,但毛病也不少。希望两者都能越来越好!

http://mobile.51cto.com/web-342061.htm

【Hybrid App】一个产品经理眼中的PhoneGap Vs. AppCan的更多相关文章

  1. 迅雷创始人程浩:创业公司5招做好内部创新(组建小型敢死队:一共3个人,一个产品经理,两个研发;腾讯做不做这个项目是一个伪命题;让用户来验证,而不是相反 good)

    欢迎关注“创事记”的微信订阅号:sinachuangshiji 文/程浩 编者按:本文首发于微信公众号“浩哥说”(ID:haogetalks),作者程浩,迅雷创始人.内容为作者在混沌AI成长营上的演讲 ...

  2. 微通道产品经理Grover采访:美国的微通道设计

    "'哥'在中国是一种尊称吗?哈哈.我们平时都叫张小龙'龙哥'." "是的.Dan哥,当你认为某个人牛逼的时候,你就能够叫他'哥'." 我对于Dan Grover ...

  3. web app 、native app、hybrid app比较

    web app .native app.hybrid app比较 产品新人学习路 关注 2017.06.04 14:52* 字数 1887 阅读 11476评论 1喜欢 15 之前做讨论的时候,提出了 ...

  4. 3.5星|《硅谷产品》:Facebook网红社区产品经理经验谈

    硅谷产品:36讲直通世界级产品经理 作者是Facebook产品经理,目前负责的具体业务书的扉页上有含糊的介绍,书中没明确说,根据书中内容推测,主要是网红社区. 比较遗憾的是书中作者亲历的案例只有3个. ...

  5. 产品经理PM

    首先希望大家记住的就是,千万不要以为产品经理是什么高大上的光环,产品经理其实只是一种状态,一种心态而已. 大家可能看到BAT每年都会从校园里面招聘一些产品经理,尤其是我们腾讯,声称以产品为王,每年投产 ...

  6. 人人都是产品经理?关于PM你不知道的还有很多

    产品经理的职称最早出现在P&G宝洁公司,因效果非常显著,许多企业纷纷仿而效尤.硅谷知名的产品管理大师Marty Cagan在<Inspired: How To Create Produc ...

  7. 3星|《给产品经理讲技术》:APP开发技术介绍,没有技术背景的话恐怕只能看懂书中的比喻和结论

    基本是APP开发涉及到的相关技术的入门级介绍.涉及到的知识点与技术细节比较多,不少技术相关的内容并没有像标题暗示的那样没有技术背景也可以看懂,而是涉及到许多专业的术语.原理.也有一些内容是用比喻的方法 ...

  8. 看完你也能独立负责项目!产品经理做APP从头到尾的所有工作流程详解!

    (一)项目启动前 从事产品的工作一年多,但自己一直苦于这样或者那样的困惑,很多人想要从事产品,或者老板自己创业要亲自承担产品一职,但他们对产品这个岗位的认识却不明晰,有的以为是纯粹的画原型,有的是以为 ...

  9. web网站 Vs 移动App 谁更能打动你?之 产品经理篇

    从web1.0到web2.0,由单调变为丰富——无论是内容,呈现,还是用户交互,当我们(接触互联网只有五六年的人)可能还沉浸在这绚丽多彩,啧啧称奇web交互体验之中,移动App不知道在什么时候已经悄然 ...

随机推荐

  1. 安装完sql server 后修改计算机名后不能进行发布的订阅的解决办法

    由于需要需要配置一个发布订阅,可是一直报告:" sql server 复制需要有实际的服务器名称才能连接到服务器,不支持通过别名.ip地址或其他任何备用名称进行连接.请指定实际的服务器名称“ ...

  2. ArrayList、LinkedList、HashMap底层实现

    ArrayList 底层的实现就是一个数组(固定大小),当数组长度不够用的时候就会重新开辟一个新的数组,然后将原来的数据拷贝到新的数组内. LinkedList 底层是一个链表,是由java实现的一个 ...

  3. Hadoop入门--HDFS(单节点)配置和部署 (一)

    一 配置SSH 下载ssh服务端和客户端 sudo apt-get install openssh-server openssh-client 验证是否安装成功 ssh username@192.16 ...

  4. OpenGL蓝宝书第五章代码勘误以及惯性坐标系去解释模型变换:Pyramid.cpp

    假设你也发现依照教程代码完毕贴图时,你会底面的坐标和寻常顶点坐标正负相反,比方-1.0f, -1.0f, -1.0f这个顶点相应的却是世界坐标中1.0f,-1.0f,1.0f 问题到底出如今哪里? 原 ...

  5. 常用的bat命令

    获取输入法adb shell settings get secure default_input_method修改输入法adb shell settings put secure default_in ...

  6. android下大文件分割上传

    由于android自身的原因,对大文件(如影视频文件)的操作很容易造成OOM,即:Dalvik堆内存溢出,利用文件分割将大文件分割为小文件可以解决问题. 文件分割后分多次请求服务. //文件分割上传 ...

  7. Android开发系列(一)Activity与Fragment获取屏幕获取屏幕像素的不同方式

    Activity中常用的获取屏幕像素代码: //获取屏幕像素相关信息 DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getD ...

  8. android TimerTask 的简单应用,以及java.lang.IllegalStateException: TimerTask is scheduled already错误的解决方法【转】

    Android应用开发中常常会用到定时器,不可避免的需要用到 TimerTask 定时器任务这个类下面简单的一个示例演示了如何使用TimerTask这个示例演示了3秒未有触屏事件发生则锁屏(只是设置下 ...

  9. jQuery的css()方法

    jQuery的css()方法下面的代码可以为div一次性设置多个样式属性<!DOCTYPE html><html><head><meta charset=&q ...

  10. jquery属性选择器之 attr

    在温习jquery手册的时候,注意到这个,坐下记录. attr(name|properties|key,value|fn) 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配的元素的一个或 ...