几个前端UI框架的的比较

标签: 前端框架 css框架 | 发表时间:2015-02-11 03:14 | 作者:FreeZinG
出处:http://segmentfault.com/blogs

首先是在问答里面看到了一个问题:
CSS框架 ui 有哪些啊( http://segmentfault.com/q/1010000002547926

刚开始接触HTML刚开始接触JS我也不懂就看了下- 正好我也在考虑怎么用HTML来搭我的APP UI。作为初学者,我发现Amaze UI是中文的,觉得对初学者看起来会更简单 - 尤其对HTML CSS等一窍不通,很快有人推荐了Ratchet,看了下感觉用来做手机APP确实很简单的样子.. 开始纠结了.. 跟公司大神讨教了下什么是UI框架以及一些主流的框架区别 优劣势,以及我们一些项目上使用的内容后,大神总结出了以下内容,受益匪浅 - 作为答案有点长,以博文形式发出来供大家一起探讨下:

------- 以下分割线 --------
IoTgo 用的是 Bootstrap( http://getbootstrap.com),原先是 Twitter 内部的一个 CSS 框架,后来开源放到 Github 上,成了 Github 上最热门的项目。Bootstrap 在 3.0 版本之前,都是以桌面优先,在 3.0 版本后,采用移动优先,即很好的支持移动平台,然后才考虑更好的支持桌面。所以 Bootstrap 对手机的支持也很好。

Foundation(foundation.zurb.com) 是设计公司 zurb.com 推出的开源 CSS 框架,在 CSS 框架领域是目前唯一能跟 Bootstrap 的竞争的项目。Foundation 的可定制性更好一些(因为是设计公司的产品,要应对各种客户需求),但入手难度也高一些。对于很多 Web 项目开发者而言,他们需要的就是一套简单快捷的 UI,对其美观性、可定制性要求不是太高,所以目前相对来讲 Foundation 没有 Bootstrap 热门。

答案中推荐的Ratchet如何:
Ratchet 之前也是 Twitter 内部的一个 CSS 框架,后来也是开源到 Github 上,目前是作为 Bootstrap 的子项目存在( http://blog.getbootstrap.com/2014/04/02/ratchet-2-0-2-released/),开发 Ratchet 和 Bootstrap 的基本就是同一拨人。Ratchet 一开始就以移动为先,预先提供了很多移动平台的常见 UI 工具,比如底部 Tab 标签栏、顶部标题及后退按钮、滑动的侧边栏等等——Bootstrap 也有,只是很多以插件形式存在,又或者需要自己做一些修改,不像 Ratchet 默认就有。

如果是做一个小项目,而且只以手机 App 的形式存在,可以考虑先用 Ratchet,如果同时兼容桌面,Bootstrap 更好一些。而且 Bootstrap 更新的速度更快,马上 4.0 版本就要出来了,有很多针对移动平台优化的特性,而 Ratchet 已经快一年没更新了。

另外,目前的移动 CSS 框架(或者更合适的说,UI 框架),还有 Facebook 的 React( http://facebook.github.io/react/),Google 的 Angular Material( https://material.angularjs.org),Telerik 的 Kendo UI(www.telerik.com/kendo-ui),还有预先捆绑了 Cordova 的 Ionic Framework(ionicframework.com)等等。大家的评价大致是:

  • React:性能很好,因为采用了 Virtual DOM,但没有默认支持 2 way data binding(双向数据绑定),程序员需要自己做更多的工作来通过 UI 获取用户的输入
  • Angular Material:前景非常好,只是目前处于 pre-release 阶段(代码兼容性和稳定性都不是很好)。Angular目前几乎已经是前台 MVC 框架的事实标准(大约 70% 以上的占有率,其他的还有 Ember、Meteor、Backbone等等),Angular Material 基于 Google Material Design 开发,默认支持 Angular,因而在 UI的美观型和开发效率上都比较好。但性能是个问题,解决性能问题,需要程序员自己对代码做优化
  • Kendo UI:非常完备的 UI 框架,但是是商业版(前段时间将部分核心模块开源了)。开发商业 Web 或移动产品的企业更倾向Kendo UI 一些,因为可以得到很好的技术支持(当然要花钱)。Angular 热门知会,Telerik 也升级了 Kendo UI,使其能够较好的跟 Angular 交互——Kendo UI 是 UI,Angular 是前台代码逻辑
  • Ionic Framework:目前非常热门,因为他在 Angular 的基础上开发了支持移动平台的 UI Widget(UI组件)。Ionic Framework 搭好了整套移动开发环境(指的是 App 开发,不是网站移动版)、UI 套件、JS框架(Angular),因而在 2014 年获得巨大的社区反响。被誉为最有前景的移动开发框架(不仅仅是 UI 了)。

我个人对 Angular 比较热衷,所以都会选择能够很好跟 Angular 交互的 CSS/UI 框架——一般来说,如果是纯 CSS 框架,那么跟任一一个 MVC 框架(比如 Angular、Ember)都可以很好的配合;如果是 UI 框架,可能会有一些冲突。

之前我们的智能开关手机 App 是基于 Ionic Framework 来开发的,后来切换到 Angular Material。一个是 Ionic Framework 虽然入手简单,但出现 Bug 我搞不清楚该怎么修改(需要花时间研究 Ionic Framework 的内部工作机制),二是我认为 Material Design 会成为 UI 设计的主流思想,Angular Material 会很快成熟起来。

相关 [前端 ui 框架] 推荐:

最受欢迎的前端UI框架推荐

- - 氪星人
前端UI框架越来越受到新人追捧,下边小编为大家列出目前最受欢迎、最优秀的前端框架以供大家选择. 目前开源社区最受欢迎的项目之一,可谓大名鼎鼎了,最新版本3.x兼容IE9+,用于开发响应式布局、移动设备优先的Web项目. 官网: http://getbootstrap.com/. UI框架的后起之秀,UI动画效果很棒,一个很有潜力的项目.

几个前端UI框架的的比较

- - SegmentFault 最新的文章
首先是在问答里面看到了一个问题:. CSS框架 ui 有哪些啊( http://segmentfault.com/q/1010000002547926). 刚开始接触HTML刚开始接触JS我也不懂就看了下- 正好我也在考虑怎么用HTML来搭我的APP UI. 作为初学者,我发现Amaze UI是中文的,觉得对初学者看起来会更简单 - 尤其对HTML CSS等一窍不通,很快有人推荐了Ratchet,看了下感觉用来做手机APP确实很简单的样子.

UI框架选型

- - ITeye博客
  最近公司的一个新项目要进行UI框架的选型,我把选型的思路和过程跟大家分享一下.   在选型之前,我们先要定一下选型的标准,就像人生一样,想清楚“自己要的是什么”是最重要的.   选型的标准分为几部分:. 业务是根本,和大部分的技术一样,框架没有好坏之分,只有适合与不适合.         我们项目是一个通讯类的监控项目,用户群是移动、电信等运营商的运维人员,系统的特点是:.

[转] jQuery ui框架

- - CSDN博客Web前端推荐文章
   jQuery ui框架很多,除了官方提供的 jquery UI(如果你还不知道什么是 jQuery UI,请看 下载了jquery ui后如何使用),还有很多第三方提供的ui框架,因官方提供的jquery ui框架体积较大,所以很多人都不喜欢用,但不论是官方提供还是第三方提供,他们都是基于 jquery核心类库实现的ui框架.

开源Python UI框架:Kivy

- xin - 秀码趣 - ShowMuch.com
Kivy是一个可用以快速创建新颖用户界面应用的开源Python库,比如可以用它来创建多点触摸的应用程序,它具备跨平台特性,目前发行有Windows、MacOS、Linux以及Android版本. 作为一个开源框架,Kivy具备以下特性:A.百分百免费使用;B.基于 LGPL3协议 开源,对商业化应用友好;C.跨平台,支持Windows、MacOS、Linux以及Android;D.允许在不同的平台上运行同一套代码;E.稳定以及有完善的API文档;F.通过OpenGL ES 2.0对硬件进行加速;G.自然支持大部分的输入协议或者输入设备;H.基于Python的简单API……等等.

5 个界面效果很炫的 JavaScript UI 框架

- paul - 博客园新闻频道
  Web 开发很简单,Web 应用的 UI 开发却很复杂,如果能够利用一些成熟的 UI 框架可以大大的减少开发的复杂度. 本文向你介绍 5 款界面效果很不错的 JS 框架.   ExtJS 主要用来开发RIA富客户端的AJAX应用,主要用于创建前端用户界面,与后台技术无关的前端ajax框架. 因此,可以把ExtJS用在.Net、 Java、Php等各种开发语言开发的应用中.

文章: Calatrava:自由构建UI的跨平台移动框架

- - InfoQ cn
移动是未来计算的趋势,越来越多的人使用移动设备来访问互联网. 但是目前至少三大平台:iOS、Android、移动Web. 相比桌面Web,移动用户需要更好的体验、界面和设计. 然而移动设备受限于电池、不可靠的网络连接和小尺寸屏幕. 创业者之翼为创业新星免费提供甲级办公场所,详情请点击. 2012RIA天地行•西南游戏开发者大会11月25日,火热报名中.

50 个免费UI和Web设计框架工具和源文件贡献

- 淼 - UI乐园
生活频道——笑谈生活,坐看人生,这里有着小人物的健康生活. 收藏到:Del.icio.us.

前端框架你究竟选什么

- - 博客 - 伯乐在线
在做web开发的时候难免遇到一个问题,那就是,选择什么样的框架. Apache基金会今天发布了Flex 4.8版本, 这是Adobe将Flex捐献给Apache基金会后发布的第一个版本. 需要注意的是,Flex目前还在孵化阶段,还不是Apache的正式项目,Flex 4.8也不是一个正式的Apache版本.

[转][转]前端开发框架对比

- - heiyeluren的blog(黑夜路人的开源世界)
来源: http://www.ibm.com/developerworks/cn/web/1404_wangfx_jsframeworks/. 本文选取了 Bootstrap、jQuery UI、jQuery Mobile、Sencha ExtJS、Sencha Touch、Sencha GXT、Dojo、Dojo Mobile、Mootools、Foundation、YUI、Kissy、QWrap 等 16 个国内外前端开发框架进行初步的横向比较,可以作为大家挑选前端开发框架的初步参考.