很多移动开发者喜欢使用原生代码开发,但这种方式并不是一个银弹,在需要快速以及低成本开发的时候Hybrid App(混合应用)就体现了它的优势。

HTML5 移动UI框架(例如Ionic)让你创建垮平台Hybrid App与NativeAPP相似的效果,而使用的则是
HTM5, CSS and JavaScript。如果你已经是一个web开发者了那么选择hybird将是一个较好的开发方式。而且只需要编写一套代码就可以在多个平台中使用。通过Cordova(PhoneGap)提供的javascriptAPI可以访问到照相机或传感器这类硬件设备。最后再编译成原生安装包发到各应用商店。

目前市面上有需要移动端的UI框架可供选择,接下来将介绍几款其中的佼佼者。

Ionic

在近几年,ionic成为了Hybrid App开发框架中的领军者,并且ionic的开发小组继续更新,并保持领先优势。ionic一直保持免费和开源,而且它还拥有庞大的生态系统,可以在社区中找到大量的资源。

ionic添加了对android材料设计的支持,同时ionic也包括了angular。像其他流行的Hybrid App框架一样,ionic也可以利用cordova来实现对原生硬件的调用。

ionic框架具有可维护性和可扩展性,使用了简单清晰的标记,大量移动端特殊优化的css(Sass),HTML5 and JavaScript 组件。

优点:

  • 基于Angularjs
  • 预置的类原生组件
  • 强大的社区

** 缺点:**

  • 需要了解Angularjs
  • 插件更新较慢
  • 动画性能较弱

官方网站

Onsen UI

Onsen UI是相对较新的框架,但是却给Ionic带来了冲击。Onsen采用Apache license开源协。Onsen UI 有通过angular的指令实现了大量的组件也提供基于jQuery的组件 。两个框架很类似但是还是存在一些不同:

与 ionic 相比

  • 两个框架都依赖与angular指令,但Onsen UI支持jQuery。
  • 两个框架都支持Android 4+, iOS 6+,Onsen UI 支持Firefox OS和桌面浏览器。但ionic没有官方的桌面浏览器支持,但还是可以用。
  • 都支持分屏显示技术
  • 都是扁平是风格,但个人觉得Ionic更好看点。
  • ionic支持SASS而Onsen UI 则是基于 Topcoat Css library。
  • Onsen UI 文档较好,但ionic的社区较活跃。
  • Onsen UI 有一个自己的IDE called Monaca IDE.

官方网站

jQuery Mobile

jQuery 依然在游戏领域与其他移动端框架抗衡。jQuery Mobile 建立在jQuery和jQueryUI的基础上。允许开发者创建webapp获得与平板、pc上无差别的用户体验。因此它无法提供类似移动端原生控件外观和体验的app.

官方网站

Mobile Angular UI

这是为bootstrap和angular的粉丝而准备的。 通过 Mobile Angular UI ,可以通过bootstrap3和Angular 构建 移动应用。

Mobile Angular UI 提供指令可以构建移动端UI Component 例如 overlays, switches.sidebars,scrollable .

官方网站

结论

目前市面上最常用的几款开源的移动端框架,总体上来均不错,但如果是要追求最终app的视觉效果则Ionic与Onsen是较好的选择,它们的UI看上去更像原生控件。如果你是jquery的粉丝,并且不想尝试使用其他的那么可以选择jQuery Mobile 简单高效。
如果你熟悉angular与bootstarp那么Mobile Angular UI则是不错的选择。

除了开源的框架外还有一些企业级框架这些框架功能强大但需要相应的费用,比如Sencha Touch 与 Kendo UI 。


参考链接

[01] http://noeticforce.com/best-hybrid-mobile-app-ui-frameworks-html5-js-css

几款开源的hybird移动app框架分析的更多相关文章

  1. 推荐一款开源的C#TCP通讯框架

    原来收费的TCP通讯框架开源了,这是一款国外的开源TCP通信框架,使用了一段时间,感觉不错,介绍给大家 框架名称是networkcomms 作者开发了5年多,目前已经停止开发,对于中小型的应用场景,够 ...

  2. metasploit 一款开源的渗透测试框架

    渗透神器漏洞利用框架metasploit from: https://zhuanlan.zhihu.com/p/30743401 metasploit是一款开源的渗透测试框架软件也是一个逐步发展与成熟 ...

  3. 越折腾越好用的 3 款开源 APP

    高中的时候我特别喜欢捣鼓手机,然后我一个哥们儿在我的强烈推荐下买了个 HTC Dream(G1) 手机. G1 作为谷歌的第一个亲儿子,它出厂搭载的是 Android 1.5 系统,但当时已经出到了 ...

  4. 移动app框架inoic功能研究

    原生移动app框架inoic功能研究 本篇只侧重框架提供的功能和能力的研究,请关注后续实际部署使用体验. 一.inoic是什么? inoic是一个可以使用Web技术以hybird方式开发移动app的前 ...

  5. (转)12款开源JavaScript库

    JavaScipt几乎是所有前端开发人员必会的编程语言,并且,随着各种移动APP的串红,JavaScript还可以用来开发移动应用.除此以外,为了丰富前端/移动开发,有不少开发者推出了各种基于Java ...

  6. 开源巨献:Google最热门60款开源项目

    文章整理于互联网.本文收集了 60款 Google 开源的项目,排名顺序按照 Github ★Star 数量排列. 0.机器学习系统 TensorFlow  ★Star 62533 TensorFlo ...

  7. [转]Web App 框架选择之百度&腾讯

    百度的GMU GMU(Global Mobile UI)是百度前端通用组开发的移动端组件库,GMU是基于zepto的mobile UI组件库,提供webapp.pad端简单易用的UI组件.具有代码体积 ...

  8. 如果你不知道这11款常见的Web应用程序框架 就说明你out了

    本文推荐了11款常见的Web应用程序框架,并列出了相关的学习资料和下载文档.如果对这些项目还不熟悉,就赶紧学起来吧~ Rails Rails是Ruby on Rails的简称,是一款开源的Web应用框 ...

  9. 一款开源免费的.NET文档操作组件DocX(.NET组件介绍之一)

    在目前的软件项目中,都会较多的使用到对文档的操作,用于记录和统计相关业务信息.由于系统自身提供了对文档的相关操作,所以在一定程度上极大的简化了软件使用者的工作量. 在.NET项目中如果用户提出了相关文 ...

随机推荐

  1. Derived Column 用法

    Derived Column Component 用法是为数据流增加派生列,Derived column  有两种用法:add as new column 或 replace . 图中,增加一个 De ...

  2. 新作《ASP.NET Web API 2框架揭秘》正式出版

    我觉得大部分人都是“眼球动物“,他们关注的往往都是目光所及的东西.对于很多软件从业者来说,他们对看得见(具有UI界面)的应用抱有极大的热忱,但是对背后支撑整个应用的服务却显得较为冷漠.如果我们将整个“ ...

  3. Delete Volume 操作 - 每天5分钟玩转 OpenStack(57)

    今天讨论 cinder 如何删除 volume . 状态为 Available 的 volume 才能够被 delete.如果 volume 当前已经 attach 到 instance,需要先 de ...

  4. 修复bootstrap daterangepicker中的3个问题

    最近项目中使用了一个基于Bootstrap的daterangepicker控件. 1.点击页面其他空白的地方,会把之前在日历上选中的日期选择上. 具体描述: 1.点击打开日期选择框 2.选择一个日期范 ...

  5. 关于在用curl函数post网页数据时,遇上表单提交 type为submit 类型而且没有name和id时可能遇到的问题及其解决方法

    curl函数库实现爬网页内容的链接在 http://www.cnblogs.com/linguanh/p/4292316.html 下面这个是没有name和id 标识的 <input type= ...

  6. 如何添加并设置远程桌面(RD)授权服务器

    上一篇日志中介绍了如何将现成的远程桌面授权服务器添加到对应的远程桌面回话主机中. 本篇日志将引导您如何添加配置相应的远程桌面授权服务器,这样就可以根据所购买的授权类型和授权级别添加需要甚至" ...

  7. 把《c++ primer》读薄(4-1 c和c++数组)

    督促读书,总结精华,提炼笔记,抛砖引玉,有不合适的地方,欢迎留言指正. c和c++的数组和指针都属于低级的复合数据类型,比如c++的数组,类似vector容器,指针类似迭代器.低级的数据类型优势是速度 ...

  8. python mock基本使用

    什么是mock? mock在翻译过来有模拟的意思.这里要介绍的mock是辅助单元测试的一个模块.它允许您用模拟对象替换您的系统的部分,并对它们已使用的方式进行断言. 在Python2.x 中 mock ...

  9. PHP之验证码的实现

    简单的用PHP实现验证码: ?php /** *制作验证码 *1.启动session *2.设定标头 *3.创建画布 *4.创建颜色 *5.创建随机数并放到画布上 *6.将得到的若干随机数放入sess ...

  10. Linux iptables原理--数据包流向

    Iptable与Netfilter 在上一篇文章 linux iptables常用命令--配置一个生产环境的iptables 我们知道iptables有好几个表,如raw,mangle,nat,fil ...