【专业论坛】HTML5将颠覆原生
1. HTML5发展
未来App的市场呈现一片光明景象,而对于移动开发商来说,不同平台的应用则需要开发不同的App来支持,无论在更新及维护上都需要一定的成本。于是更多人想到了基于HTML5的Web App,目前主流操作系统iOS、Android以及Windows Phone的浏览器都对于html5大部分特性的支持也更加突显HTML5在未来移动设备端的地位。
Html5的特性在于对于开发者,可以更多地跨设备、跨平台使用。强大的跨平台性也为企业大大降低了开发成本、丰富的标签体系,也大大降低了应用开发的技术门槛。
2. HTML5开发手机APP过去的劣势与当前的优势
² 劣势
在低端Android手机上,过去的HTML5切页白屏、转场卡顿、下拉刷新不流畅、侧滑菜单不流畅,HTML5技术无法对硬件底层的功能进行调用。众多问题逼迫开发者只能用原生技术解决。HTML5 App的性能低下,有webview自身的性能问题,也有前端框架的性能问题。
² 优势
在多屏年代,开发者的痛苦指数非常高,人人都期盼HTML5能扮演救星。多套代码、不同技术工种、业务逻辑同步,这是折磨人的过程。有点类似个人电 脑早期世界,那个时候的每家电脑都有自己的操作系统和编程语言,开发者疲于做不同版本,其实DOS的盛行也很大程度是因为开发者实在没精力给其他电脑写程序。跨平台技术在早期大多因为性能问题夭折,但中后期硬件能力增强后又会占据主流,因为跨平台确实是刚需。
3. 开发工具及MUI框架
开发工具
HBuilder是DCloud推出的一款支持HTML5的Web开发IDE。快,是HBuilder的最大优势,通过完整的语法提示和代码输入法、代码块等,大幅提升HTML、js、css的开发效率。同时,它还包括最全面的语法库和浏览器兼容性数据。
HBuilder
² 编码比其他工具快5倍够不够?对极客而言,追求快,没有止境!
² 代码输入法:按下数字快速选择候选项
² 可编程代码块:一个代码块,少敲50个按键
² 内置emmet:tab一下生成一串代码
² 无死角提示:除了语法,还能提示ID、Class、图片、链接、字体…
² 跳转助手、选择助手,不用鼠标,手不离键盘
² 多种语言支持:php、jsp、ruby、python、nodejs等web语言,less、coffee等编译型语言均支持
² 边改边看:一边写代码,一边看效果
² 强悍的转到定义和一键搜索
² 这里还有最全的语法库、最全的语法浏览器兼容库。
MUI框架
由于HTML5的默认控件无法直视,我们只能用css把按钮、输入框修饰成原生样式,以及HTML5的控件比原生控件少很多,比如list、tab、menu、waiting等常见控件,以往都要写很多div和css拼装。这引发了一个前端框架存在的市场。但目前的前端框架性能都非常低,在低端手机上很难达到商用要求,更不用提pk原生效果。
Jquery mobile比较知名,但有3个硬伤:1. 体积高达500k;2. data-的写法虽然写起来简单,但在运行时需要js去解析HTML5标签并替换为新的dom结构,这是非常消耗手机资源和影响加载速度的;3. 样式风格自成一派,不是用户所熟悉的原生样式。
而MUI框架它是目前最高性能和最接近原生体验的手机端框架。它的3个特点与Jquery mobile正好对应:1. 体积小,不到100k; 2. 直接使用class编写,性能远高于data-方式,又通过代码块的编写方式降低了开发者编码的复杂度,在HBuilder里敲m,会拉出一排控件mList、mButton等,选一个回车,就会自动产生div和class; 3. mui的风格样式是最接近原生样式的。
4. 开发案例
我公司使用HBuilder开发的云浮随身游项目可以对电厂十几个系统的数据进行显示汇总统计。通过该项目的建设,电厂员工可以通过手机客户端软件,方便地获取相关系统的最新数据,在客户端用户使用稳定流畅。
5. 总结
如今的流应用,不但解决了HTML5的性工能缺陷,还在发行推广上做到了超越原生的优势。使用HTML5开发跨平台App不再是小公司为了省钱的过渡方案,而成为一线互联网公司的选择。不管是站在最终用户角度、还是站在开发者角度,HTML5必将取代原生应用当前的位置,并由此引发一系列颠覆。
- 上一篇: 第一条
- 下一篇:【专业论坛】使用Nginx打造负载均衡