转载Hybrid APP了解

Posted 2020-08-10 笨鸟居士的博客

 

原文：http://uikoo9.com/blog/detail/hpp

不错的hybrid app框架：http://www.dcloud.io/case/#group-1

HPP
hybirdApp或者hbuilderApp，

指通过html，css，js语言开发出ios和android两个版本的APP，

开发效率成倍上升，开发时间大幅缩减，开发成本同样也大大缩减。



移动互联网时代，还有多少中小公司没有自己的app，原因何在？
1.中小公司有多少？
这个都不需要引用相关数据，想想一句话就明白了，

“一将功成万骨枯”，这句话同样适合创业者，普通人耳熟能详的大公司已经很多了，

可以想象下中小公司有多少，数量极多极多。



2.大部分中小公司没有自己app
迫于app开发人员的用人成本极高，

初级android，ios工资基本10k左右，中级15k左右，高级25k左右，大概这个价，

中小公司找两个初级的做不出东西，找两个中级的差不多了，但是时间成本用人成本都很高，

最终的结果是只能做出一个demo类的app，或者计划一直往后拖，

又或者根本没有能力招app开发~



HPP，让所有中小公司轻松拥有自己的APP
1.成本比较
拿开发一个app，需要6个月，android，ios两个版本，

配备andorid中级（15k）+ios中级（15k）来说，成本是30*6=180k=18w，

配备一个hpp中级（15k）来说，成本是15*3=45k=4.5w，

这里是乘以3不是乘以6，因为hpp开发速度绝对比原生开发快一倍。

这样一来，

hpp开发app的成本是原生app的四分之一~

hpp开发app的成本是原生app的四分之一~

hpp开发app的成本是原生app的四分之一~



2.招人难度
android和ios的工资这么高（相对其他工种），原因之一就是招人比较难，

而hpp开发，只要会html+css+js就可以，

想想哪个java开发，php开发，.net开发不会点html+css+js，只需要在精通点，

想想哪个前端开发，不精通html+css+js呢，

所以招人来说，完成原生app



3.流畅度和加载速度
很多人会说流畅度，

随着手机厂商的竞争，手机硬件的发展，想想现在的千元小米，魅族之流，

目前来说千元机都很流畅，以后来说是手机就很流畅。

很多人说加载速度，

诚然，中小公司自己的带宽限制等等因素，加载页面比较满，

但是想想网络发展，从2g，3g，4g以及之后的5g，以及wifi的adsl，光纤，512k，1m，2m，10m，20m，

以及现在越来越普及的云服务，百度bae，新浪sae，阿里云等等，

网速也不是问题了。



HPP详述
1.HPP由来
其实用html+css+js本人用得比较多的是dcloud（公司）推出的hbuilder（ide），使用mui（ui）+nativejs开发app，

但是总这么hbuilder，mui的叫，感觉不是很顺口，或者不是很响亮，

百度上说基于html+css+js开发app的技术叫做HybirdApp，详见：这里

所以借用HybirdApp和Hbuilder开发的App这两个概念，推出HPP的叫法，

简单，好记。



2.HPP案例
说了这么多，如果你已经心动了，不妨看看这些HPP案例，

http://dcloud.io/case/#group-1

可以看出，HPP开发app本身流畅度是毫无问题，问题在于ui设计太low，一下子拉低档次，

如果有一个好的ui，外加一下开发的技巧，开发出的app还是很棒的，例如“爱学车”这个HPP。



3.HPP趋势如何
硬件趋势：手机硬件性能越来越好，

网络趋势：网速越来越快，

就业趋势：12年错过了android的你，15年还想错过HPP？



疑问解答
1.一次开发，生成android和ios两种app？
是的



2.需要熟悉哪里技术才可以从事HPP开发？
需要熟悉html，css，js，最好熟悉jquery，以及一些常用框架的上手方法（bootstrap，amazeui）。



3.具体使用哪些技术工具？
使用Hbuilder做ide进行开发打包app，

使用mui做ui层，理论上可以用其他的ui框架，例如amazeui，bootstrap，jquery mobile等，

使用nativejs做js桥调用原生方法，这个无可替换，比较重要。



4.免费吗？
Hbuilder已经开源，所以ide免费：https://github.com/dcloudio/HBuilder-opensource

mui已经开源，所以ui免费：https://github.com/dcloudio/mui

总之都是开源，都是免费的，看这里：https://github.com/dcloudio



5.开发的时候用浏览器调试和看效果？
no

虽然开发语言是html+css+js，但是成果是一个app，也就是一个apk或者ipa，

你见过用浏览器调试apk或者ipa的吗？

最佳推荐是真机调试。



6.只是网页套了个webview吗？原生功能可以调用吗？
完全不是，原生功能都可以调用，原生体验：http://www.dcloud.io/runtime.html



7.mui是个啥，可以替换吗？
mui是负责你做出来app的ui效果的，

完全可以替换为其他ui框架，bootstrap，amazeui等等，

dcloud做的不好的是mui太杂了，让很多人搞不清楚，

mui既负责了ui框架的部分：样式，组件，效果

mui又负责了js操作的部分：dom操作，事件绑定等，完全是copy的jquery，但是做的又没有jquery好，有很多坑。

mui又负责了原生调用的一部分：mui.init，mui.plusready等，

在我看来，mui只需要做好ui的部分就行，或者干脆交给国内类似的amazeui做，节省精力，效果还更好，

然后让js操作用jquery实现，又节省好多精力，效果性能还好，

最后专注于nativejs的开发，研发更多更好的原生能力，三方插件等。



技术的意义究竟何在？
1.提高效率，降低成本
以javaee的mvc框架们为例，

从刚开始的jsp+servlet，

到后来的ssh1（spring+struts1+hibernate），

再后来的ssh2（spring+struts2+hibernate），

然后的ssm（spring+springmvc+mybatis）。

除了jsp+servlet只是在学习过程中使用，而没有在工作中使用外，其他的框架都在工作中使用过，

也见证了几个公司框架的更新路程，



但是，停下来思考下，为什么框架在不停的更新，不停的变，

也许框架怎么变，最终用户看到的东西都是一样的，从用户的角度看，框架的变更毫无意义。

那么意义是？可能有人很快就会说，“更加安全”，“开发更快”。。。



伪原因：更加安全

为什么这么说，旧的框架由于历史原因会有很公开很明显的漏洞，为了避免这个漏洞你更新到了新框架，

但是请相信，新的框架也会有漏洞在等着你，

所以“更加安全”这个理由完全是为了凑字数或者说你作为架构者想推行自己熟悉框架的借口~



原因1：开发快

这个才是真正的原因，开发快，比较下jsp+servlet时代和后期的mvc框架时代，

不得不说，开发速度大大加快。



原因2：成本低

就公司招人的成本来说，新人总是熟悉新框架，当你想招一大波廉价的劳动力的时候，

发现你公司用的ssh1对于新人来说早已不知道是什么玩意，反而炫耀自己用的ssm，嘲笑你用的ssh1，

所以如果你想在目前的市场招到一大波的廉价劳动力，那么更新公司的框架在所难免。



原因3：自我实现

这个原因听起来比较怪，但是可以说却是根本原因，

技术世界就像中国的历史朝代一样，不停的更替，

如果一个技术新人，技术相当好，却出生（工作）在ssh1时代，

为了想证明自己的技术能力，为了让自己获得更好的报酬，

所以举起“更加安全，更加快速”的大旗，开始建立自己的朝代（ssm）。

同样，对于培训机构来说，为了招到更多的学生，

总是不停的退出新的框架教程，

最后，招来了更多的学生，培训出了更多熟悉新框架的工作新人。

技术研发者和技术推广者（培训）的自我实现才是推进技术更新换代的最根本原因，

技术接受者（新人）和技术使用者（公司）只能被迫的接受这种变化。



站在公司的角度，技术存在的意义只有：

提高工作效率：同样的时间内开发更多的东西；

降低用人成本：使用工作新人们都懂的框架，以便以更低的成本找到更多的人。



2.提高用户体验，科技方便生活
上面所说的技术意义，偏向于用户看不到的后台的技术，其意义就是降低成本，

还有一种技术是和用户实时相关的，用户看得见的，一直在使用的，可以方便生活，简化工作流程的。

例如html5，css3，让用户看到的网页越来越好看越来越有意思，

例如android，将用户拉进移动互联网时代，充话费，买外卖等等动动手指就做到了，大大方便人们的生活。



总结：
技术就是降低成本，方便生活，HPP是一门好技术~


HPP例子——滴石
官网：http://uikoo9.com/dishi

源码：https://github.com/uikoo9/dishi

教程：http://uikoo9.com/book/detail/3





HPP例子——识岁
官网：http://uikoo9.com/shisui

源码：https://github.com/uikoo9/shisui

教程：http://uikoo9.com/book/detail/5


http://uikoo9.com/
更多精彩内容