回顾2014年最流行前端开发框架对比评测.doc

回顾：2014 年最流行前端开发框架对比评测各种开发框架层出不穷，各有千秋哪些才是最适合开发者的呢？文军信息根据 Github 上的流行程度整理了 2014 年最受欢迎的 6 个前端开发框架，并进行对比说明，希望帮助有需要的朋友选择合适自己的前端框架如今，各种开发框架层出不穷，各有千秋哪些是去年较受开发者关注的呢？文军信息告诉我们，前不久，云适配根据 Github 上的流行程度整理了2014 年最受欢迎的 6 个前端开发框架，并进行对比说明，希望帮助有需要的朋友选择合适自己的前端框架1. Bootstrap Bootstrap 毫无疑问是现今框架的领导者他不仅仅流行，每天用户量也在不断增长你可以相创建者：Mark Otto and Jacob Thornton 发布：2011 当前版本：3.3.1 流行度：75,000+ stars on GitHub 描述：“Bootstrap is the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.” 核心概念/原理：RWD 和 移动优先 框架大小：145 KB 预处理器：Less and Sass 响应式：Yes 模块化：Yes 起始模版/轮廓：Yes 图标集：Glyphicons 其他插件：无绑定，有其他三方插件 独特组件：Jumbotron 文档：Good 定制：基本 GUI 定制，不过需要手动修改,因为无颜色选取工具。

 浏览器支持： Firefox、Chrome、Safari、IE8+（IE8 需要 Respond.js） 授权： MIT2. Foundation by ZURB与 Bootstrap 相比，Foundation 屈居第二，不过这并不能说明它不受欢迎ZURB 在后面强有力的支持，使得 Foundation 更加强大！Foundation 被各大网站使用，如 Facebook、Mozilla、Ebay、 Yahoo、美国国家地理网站等等 创建者：ZURB 发布：2011 当前版本：5.4.7 流行度：18,000+ stars on GitHub 描述： “The most advanced responsive front-end framework in the world” 核心概念/原理：RWD、Mobile First、Semantic 框架大小：326 KB 预处理器： Sass 响应式： Yes 模块化： Yes 启始模版/布局： Yes 图标集：Foundation Icon Fonts 其他组件：Yes 独特组件：Icon Bar、 Clearing Lightbox、Flex Video、Keystrokes、Joyride 、Pricing Tables 文档：Good。

有许多资源可参考 定制： 无 GUI 定制，但可自己写 浏览器支持： Chrome、Firefox 、Safari、IE9+、 iOS、 Android、Windows Phone 7+ 授权：MIT 与众不同：对于商务运输、教育培训、咨询等行业来说，Foundation 是一个专业框架它还提供很多资源让你快速学习3.Semantic UISemantic UI 正在不懈努力让网页制作变得更加 Semantic原生语言规则让代码更易读易懂 创建者：Jack Lukic 发布：2013 当前版本：1.2.0 流行度：12,900+ stars on GitHub 描述： “A UI component framework based around useful principles from natural language.” 核心概念/原理： Semantic、Tag Ambivalence、Responsive 框架大小：552 KB 预处理器：Less 响应式：Yes 模块化：Yes 启始模版/布局：No 图标集：Font Awesome 其他组件：No 独特组件：Divider、Flag、Rail、Reveal、Step、Advertisement、Card、Feed 、Item、 Statistic、Dimmer、Rating、Shape 文档： 非常完善。

Semantic 提供多个结构层次的文档，单独网站提供给初学者以及其它定制教程等 定制：无 GUI 定制，但可自己写 与众不同：Semantic 可以说今天所讨论的框架中是最创新、功能最全面的框架整体构架、命名规则，有清晰的逻辑、语义性，超过其它框架4. Pure by Yahoo!Pure 是一个纯 CSS 编写，轻量级的、模块化的框架，包含各种整合和独立的组件 创建者：Yahoo 发布：2013 当前版本：0.5.0 流行度：9,900+ stars on GitHub 描述：“A set of small, responsive CSS modules that you can use in every web project.” 核心概念/原理： SMACSS、Minimalism 框架大小：18 KB 预处理器：None Responsive：Yes 模块化：Yes 启始模版/布局：Yes 图标集：None可使用 Font Awesome 替代 其他组件：None 独特组件：None 文档：Good 定制：Basic GUI Skin Builder 浏览器支持：最新版本的Firefox，Chrome ，Safari，IE7+，iOS 6.x、7.x， Android 4.x。

 授权：Yahoo! Inc. BSD 与众不同：Pure 为你的项目提供干净的基础框架对于那些不需要一个全功能的框架，只需要特定的组件的开发者，Pure 是一个不错的选择5. UIkit by YOOthemeUIkit 是一个简洁的易于使用和易于定制组件虽然它不像其竞争对手一样受欢迎,但是它提供了和上面框架相同的功能，质量也很不错 创建者：YOOtheme 发布：2013 当前版本：2.13.1 流行度：3,800+ stars on GitHub 描述：“A lightweight and modular front-end framework for developing fast and powerful web interfaces.” 核心概念/原理：RWD、Mobile First 框架大小：118 KB 预处理器：Less、Sass 响应式：Yes 模块化：Yes 启始模版/布局：Yes 图标集：Font Awesome 其他组件：Yes 独特组件：Article、Flex 、Cover 、HTML Editor 文档：Good 定制：高级 GUI 定制 浏览器支持 ：Chrome、Firefox 、Safari、IE9+ 授权：MIT 与众不同：UIkit 在许多 WordPress 主 题中都有应用。

通过 GUI编辑器和手动编辑，它提供了一个灵活、强大的自定义机制6.Amaze UIAmaze UI 是以移动优先（Mobile First）为理念，相比国外框架，它更关注中文排版，被前端工程师们赞称最懂中文的前端框架，正式上线仅仅 4 个月，已经在 Github 上获得1500+stars，可 见火力十足 创建者：云适配 发布：2014 当前版本：2.0.0 流行度：1500+ stars on GitHub 描述：Amaze UI 是一个移动优先的跨屏前端框架，含有丰富组件可快速构建界面出色、体验优秀的跨屏页面，大幅提升开发效率 核心概念/原理：Responsive 、Web Components 框架大小： CSS 40KB、JS 48KB (gzipped) 预处理器：Less 响应式：Yes 模块化：Yes 启始模版/布局：Yes 图标集：Font Awesome 其他组件：Yes 独特组件：加载进度条、侧边栏、图片轮播、固定元素、分页、折叠面板、图片画廊等 文档：Amaze UI 文档非常完善适应各个阶段的开发者，提供多个结构层次的文档，API 设计合理并易于学习和使用，BUG 反馈依靠GitHub 和官方 群、多说留言等，使用者能及时反馈问题。

 定制：目前无 GUI 定制，定制需要下载定制配置文件，下载 Amaze UI 的源码使用 gulp 构建工具自定义编译 浏览器支持： 面向现代浏览器开发，对 IE 8 提供有限的支持 与众不同：Amaze UI 加入了更多符合中国市场特性的元素：中文排版更优化，兼容中国本土主流浏览器，Web 组件按照 Web Components 的实现形式，将移动开发中常用的组件切割成不同部分，大大提高开发效率什么样的框架适合你？最后，文军信息给我们几点建议，帮助大家选择适合自己的框架： 框架足够流行吗？越是流行说明使用的人越多，各种资源也就越多，可以交流的方式也就越多被抛弃的几率越小，你可以更加安心使用该框架 框架是在持续发展吗？好的框架需要不断更新改善，适应当前的各种技术，尤其是移动端 框架成熟吗？如果，一个框架没有在实际项目中实践，你可以随便拿来练手，但是，如果要用到专门的项目中，还是找比较成熟的框架靠谱 是否提供完善文档？在学习阶段，一份完善的文档可以帮助我们事半功倍 特异性程度如何？相比一个特殊的框架，一个通用的框架可以让开发更加简单大多数情况下，选择最小的样式可以让定制更简便，添加新 CSS 比覆盖原有样式更加 简单易操作且更有效率。

最后，如果你还是不太确定这框架是否适合自己，你可以从不同项目中找出一两个组件放入自己的项目中如此合成，应该也是有帮助的。