HTML5+MUI+HBuilder 之初探情人

07，08年那会儿正当Java火爆，C/C++仍是广泛运用的一门语言的时候，所以 我的大学都献给了C/C++和Java。当诺基亚的倒闭成为按键机时代衰落的标志时，移动APP的开发也如破堤之洪，爆炸式的崛起了。可惜小弟不才，反映 略慢，加上观念陈旧，（C++程序员的通病——觉得前端=低端&移动端=前端），因此并没有打好移动APP的基础。这给后来我和我们兴趣小团队做 些创意式项目也带来了难以逾越的坎。现在这会儿，哪个web应用没有移动APP客户端，就好比飞机没有机翼，帅哥没房没车没学历，美女不能生育一样，让人 无法接受，且火不起来。令人欣慰的是，我的团队里有人会Android开发， 所以我所要担心的就是IOS开发了，于是我自学了IOS上的Xcode开发。现在的我只能说是入门。入门的我发现，IOS的开发太繁琐了，毕竟我不是专门 做这个的，要成为熟练的开发者，需要花大量的时间研究开源控件，改写代码等，当然令人费心的还有Xcode奇葩的MVC逻辑（MVC用在web开发很好， 但是用在本地应用开发真的适合吗？小弟作为一个Xcode新人吐槽一句：这就相当于当年VC中的MFC！用过Delphi和CBuilder这些RAD的 都会喜欢BCB的界面开发，入手简单，所见即所得。所以在Delphi的Anders Hejlsberg去了微软之后开发出了微软至今最伟大的语言——C#及相关组件，当我第一次使用C#做Windows窗体应用开发的时候，我感觉到了Delphi界面开发的灵魂）。

言归正传，当我正迷茫自己诸多想法皆要毁于巨大的App开发成本时，MUI的出现真正的解放了我的负担。先简单介绍下MUI:

MUI（Mobile User Interface）是一套基于Html5的，遵循Html5+规范的，中国团队（是否有老外我不知道哦）开发的，开源的（遵循MIT 条款），用于手机端界面开发的一套框架。以下内容摘自MUI在Github上的项目介绍：

性能和体验的差距，一直是mobile app开发者放弃HTML5的首要原因。 浏览器天生的切页白屏、不忍直视的转页动画、浮动元素的抖动、无法流畅下拉刷新等问题，这些都让HTML5开发者倍感挫败，尤其拿到Android低端机 运行，摔手机的心都有； 另一方面，浏览器默认控件样式又少又丑，制作一个漂亮的控件非常麻烦，也有一些制作简单的ui框架但性能低下。mui框架有效的解决了这些问题，这是一个可以方便开发出高性能App的框架，也是目前最接近原生App效果的框架。——摘自MUI在Github上的项目介绍

MUI的出现绝非偶然，小弟就曾经有过类似的完整的设计，所以当MUI出现在我的视野中时，更多的是那种“英雄所见略同”的快感。我曾想过并初探过Xamaria的使用，这玩意一是收费，二是感觉有点半成品，开发环境很繁琐，不适合新手作为一个业余爱好使用。

Xamarin始创于 2011年，旨在使移动开发变得难以置信地迅捷和简单。Xamarin的产品简化了针对多种平台的应用开发， 包括iOS、Android、Windows Phone和Mac App。Xamarin由许多著名的开源社区开发者创立和参与，而且也是Mono项目的主导者——C#与·NET框架的开源、跨平台实现。——摘自百度百 科。

年初
（2014）时，我就想过为啥不可以出来一款类似于JVM的，可以运行在安卓，IOS上的虚拟机，然后开发者只需要使用一门语言
（Java，Javascript，python等）就可以开发出运行在任何移动平台的软件呢？然后再使用C#开发Winform（等于用
BCB/Delphi开发windows应用）的方式来开发APP界面呢？到那个时候，用户只需要拖拖控件，双击添加事件，修改修改样式等属性就可以完成
通用的应用。而且，APP的安装包会很小，我们把一些规范的样式和基础控件都放到这个虚拟机中，运行时只需要按照ID来调用。当然，我等草民肯定是没有这
个能力，时间，金钱来做这个的。。。

MUI
的诞生，绝对是我今年听到的对我最有用的软件行业的消息之一了！它将极大的提高了草根程序员开发web产品的单兵作战能力。虽然我不熟悉原生APP的开
发，或对于HTML,CSS和JS并不能说是精通，但是不虚！！至少有经验，了解原理。跟Xcode的学习成本比，这算啥！虽然我是xcode菜鸟，不应
该黑xcode，不过之前的swfit的出现，让我看到了猪跑···（没吃过猪肉，还没见过猪跑吗？）

MUI
是移动端开发的革命者之一（同类的产品已经陆续出现）！终将革掉那些高富帅，“土豪劣绅”，大地主（BAT等勿对号入座
^_^）才能用的起的开发方式的命。也许MUI之后还有更加优秀的类似框架产生，但是不可否认的是，目前（2014年年底），MUI是基于H5的最好的，
最有潜力的前（钱）途的框架！

MUI框架的原理图如下：

HTML5+
Runtime即H5的运行环境，它的功能其实就是手机上Web browser，不过要加上一个形容词：高效的！
它执行JS和HTML的速度比IOS自带的Safari可要高多了。通过高效执行HTML5和JS，MUI框架才能实现和Native媲美的速度。

MUI框架目前的产品——HBuilder，也是遵循了H5+规范的H5
IDE。通过HBuilder，我们可以快速开发出H5网页，而它跑在MUI框架中的速度非常快，您不用担心他看起来不像native。另
外，HBuilder号称史上最牛的Html+js
IDE，提供了各种快捷键，和缩写方式。小弟体验了下，感觉确实不错。不过这个工具做的再好，毕竟意义没有MUI本身大，不过还是非常值得鼓励的。

要使用HBuilder开发和调试移动端APP（且容忍小弟这么称呼吧），只需要：

（1）下载手机端软件：http://dcloud.io/hellomui/

（2）下载Hbuilder，安装，打开。

————————下面是开发阶段了——————

（3）新建，编写一个项目（html，js，css，图片等组成的）。

（4）插上您的手机，连接到电脑，点击运行按钮（具体的方式参见教程），进行调试。

（5）打包发布！

咋样？就这么简单。这快感！！！啧啧。

再来谈谈我对MUI的发展预测：

一开始，MUI最为一个吊丝框架，肯定不敢大摇大摆的要求这要求那的，所以只能把自己的runtime打包到任何一个发布的应用中。所以如果一个用户的手机里装了多个Hbuilder开发的APP，那么会有多个重复的基本库。不过MUI框架是很小的，不用很担心。

随着MUI的推广，样式的丰富，对Runtime和核心包作出了更大更复杂的要求，因此这个包应该会变大，从而推动了H5 + Runtime的平台化和固件化（软件固件），也许过几年，每个手机的操作系统都会自带这个运行环境，基于它开发的APP可能只有几百KB。

至于MUI的钱途命运，要么自成一家，为各大手机商提供服务，索要服务费用，又或者被Apple，三星这样的巨头以重金收购。总之，这项技术是很好的，但是盈利模式和最终命运会和Java类似。

希望MUI的同志再接再厉，做好后续的服务和工作。刚使用了下语音输入功能，好像有点小BUG。

最后引用一句名言，或者说是废话，开个玩笑，听听就行：

草根程
序员想要逆袭高富帅，迎娶百富美，就必须使用更加廉价(both in time and
money)，高效，高端的工具，让我们有时间去关注业务！去思考未来！去享受生活！那些个啥啥啥啥的，老说开发不懂业务不懂爱，程序员细心的操作，耐
心；架构师缜密的思维，大局观，你真当我们玩不转业务么？我们只是穷(both in time
and money)，没得选择而已（戳到泪点）。——马莎士比亚云。