2016 年最具潜力前端开源项目 Top20

在 2016 年，前端的开源世界越发精彩， Vue 的不断壮大， Angular 2 的发布， Amaze UI 3.0 蓄势待发，黑马级别的 Ant Design ，这些都给 2016 年的前端世界注入了不同的鲜活血液。作为一名前端开发者，今天就给大家盘点一下在过去的 2016 年中，哪些开源项目值得期待，哪些具有成为开发者眼中 NO.1 的潜力。

因盘点的开源项目不能完全以技术等标准来判定谁高谁低，所以以下项目排名以 Github 上 Star 数量排名，且盘点的项目里均是在 2016 年中保持了较高的活跃度（有重大更新、重大事件、最新发布等），毕竟个人精力和水平有限，如有不足之处还请见谅。

1 、 Bootstrap

官网:http://getbootstrap.com/

Github:https://github.com/twbs/bootstrap

Star:10W+

最近更新:4.0.0-alpha.5 （ 2016.10.19 ）

介绍:作为老牌的前端框架， Bootstrap 一直保持着不俗的成绩， Bootstrap 4 目前也正处于 Alpha 阶段，预计在 2017 年发布。值得关注的变化是新的通用卡片组件和 Flexbox 网格（查看与常规网格的对比），这使得框架更加现代化，并且让用户使用它进行工作时更加得舒心。

2 、 React

作者:Facebook

官网:https://facebook.github.io/react/

Github:https://github.com/facebook/react

Star:5.7W

最近更新:v15.4.1 （ 2016.11.23 ）

介绍:无人不知，无人不晓的新兴技术栈，一经推出，就受到了前端圈的极度关注，经过 2016 年的洗礼，已经逐渐成为了很多企业的开发技术栈标配。作为 2016 年最具潜力，乃至最具影响力的前端开源项目真的不为过。

3 、 Angular

官网:https://angularjs.org/

Github:https://github.com/angular/angular.js

Star:5.4W+

最近更新:v1.6.1 （ 2016.12.23 ）

介绍:Angular.js 2 在今年也已经发布了。该框架由 Google 进行维护，受到了众多企业和大公司的青睐。它所具备众多的功能，也为从网络到桌面以及移动应用程序中编写任何东西成为了可能。而它的框架也是用 TypeScript 所编写的，这也是写应用程序推荐的编程语言。

但也因为 Angular.js 2 太过复杂，很多特性成为了鸡肋，引起了众多开发者抱怨，希望下个版本有所改进！不过，仍然无法掩盖他在前端圈子里的火热程度。

4 、 Vue

作者:尤雨溪

官网:http://cn.vuejs.org/

Github:https://github.com/vuejs/vue

Star:3.8W

最近更新:v2.1.8 （ 2016.12.28 ）

介绍:如果说 2016 年，前端圈不可不知道的开源项目，那 Vue 绝对是名列前茅，在今年的新版本 Vue.js2.0 中，新的渲染层较之 v1 带来了巨大的性能提升，尽管渲染层全面更新， Vue 2.0 兼容了绝大部分的 1.0 模板语法，仅废弃掉了其中的一小部分。

Vue 的持续增长速度也超过了作者的预期，在 2016 年达到了几乎一个巅峰状态，在 2017 年，他们还会探索将 Vue 组件编译并且发布成原生的自定义元素以及更好的浏览器兼容性上努力，未来不可小视！

5 、 Semantic UI

作者:jlukic 等技术人员

官网:http://semantic-ui.com/

Github:https://github.com/Semantic-Org/Semantic-UI

Star:3W+

最近更新:v2.2.7 （ 2016.12.22 ）

介绍:Semantic UI —完全语义化的前端界面开发框架，跟 Bootstrap 和 Foundation 比起来，还是有些不同的，在功能特性上、布局设计上、用户体验上均存在很多差异。在程序猿圈里其因版本更新频繁，有着“版本帝”之称。

在 2016 年发布的 2.2 版本中，做了诸多改进以及加入了新的 UI 元素，更新日志长达十页之多，作为名副其实的“版本帝”，在 2017 年也将会有大动作，也是值得期待的开源项目之一。

6 、 Ionic

作者:Ionic 技术团队

官网:http://ionicframework.com/getting-started/

Github:https://github.com/driftyco/ionic

Star:2.7W

最近更新:v2.0.0-rc.4 （ 2016.12.15 ）

介绍:Ionic 是一个轻量的手机 UI 库，具有速度快，界面现代化、美观等特点。为了解决其他一些 UI 库在手机上运行缓慢的问题。它使用 JavaScript MVVM 框架和 AngularJS 来增强应用，专注于用 WEB 开发技术，基于 HTML5 创建类似于手机平台原生应用的一个开发框架。 Ionic 框架的目的是从 web 的角度开发手机应用，基于 PhoneGap 的编译平台，可以实现编译成各个平台的应用程序。

目前最新版本是 v2.0.0-rc.4 ，进行测试中的 Ionic2 新增了诸多新特性，将会在 2017 年带给开发者不一样的体验！

7 、 Backbone

作者:jashkenas 等技术人员

官网:http://backbonejs.org/

Github:https://github.com/jashkenas/backbone

Star:2.5W

最近更新:v1.3.3 （ 2016.4.6 ）

介绍:又是一款老牌的前端类库，他是第一代的前端 MVC ， Backbone 最适合的应用场景是单页面应用，并且页面上有大量数据模型，模型之间需要进行复杂的信息沟通。 Backbone 在这种场景下，能很好的实现模块间松耦合和事件驱动。 其他适用产品还有微博，网易微博的前端设计也是和 Backbone 类似的一个结构，早年的有道云笔记 Web 版就是用的 Backbone 。

虽然过去了五六年的时间，但是 Backbone 依旧还保持着常年的更新，虽然并没有看到太大的改进，但始终还是有一批人在使用着。

8 、 Foundation

作者:ZURBfoundation

官网:http://foundation.zurb.com/

Github:https://github.com/zurb/foundation-sites

Star:2.4W+

最近更新:v6.3.0 （ 2016.12.16 ）

介绍:这是一款传说中标榜世界上最先进的前端响应式框架，能够快速创建运行在任何设备上的应用的原型和产品代码，虽然并没有说的那么夸张啦，但本身的发展史也可以跟 Bootstrap 相媲美了，并且也保持着不俗的更新。

如果一个产品不能保持持续的更新，或许会慢慢淡出人们的视野，当很多人以为 Foundation 在 Vue 等的大潮下会消失，但没想到在 2016 年的 6.3.0 版本的更新让他再次出现在人们的眼前，我们也有信心期待他在 2017 年有更大的突破！

9 、 Ember

作者:YehudaKatz

官网:http://emberjs.com/

Github:https://github.com/emberjs/ember.js

Star:1.7W+

最近更新:v2.10.2 （ 2016.12.20 ）

介绍:Ember 是 JavaScript 框架的另一个不错的选择。它支持数据双向绑定，并能够自动更新模板、组件以及服务器端渲染。与其他竞争者相比，使用它的好处是它更加成熟与稳定，而其框架的重大更改频率之低，社区重视向后的兼容性，也使得此框架成为开发较长生命周期的应用程序的不二之选。

10 、 Echarts

作者:百度前端技术团队

官网:http://echarts.baidu.com/

Github:https://github.com/ecomfe/echarts

Star:1.5W+

最近更新:v3.3.3 （ 2016.11.24 ）

介绍:ECharts 是一款由百度前端技术部开发的，基于 Javascript 的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。目前也已经成为了百度开源项目中的佼佼者，也是目前在国内使用人数最多的数据可视化的开源项目。

在 2016 年重磅推出的 3.0 版本更是加入移动端交互体验、更小的体积文件、更灵活的打包方式，我们相信，在未来 ECharts 还会新增更多特性来提高他的活跃度。

11 、 Weex

作者:阿里巴巴

官网:https://weex-project.io/

Github:https://github.com/alibaba/weex

Star:1W+

最近更新:v0.9.4 （ 2016.12.22 ）

介绍:Weex 的前身是 WeApp ，一个用 JSON 配置原生 UI 组件来实现动态化的框架， Weex 是 WeApp 的进化版本，加上 ex 去掉 App ，就成了现在这个名字。在 2016 年 4 月份的 Qcon 大会上正式宣布开源， 对于移动开发者来说， Weex 主要解决了频繁发版和多端研发两大痛点，同时解决了前端语言性能差和显示效果受限的问题。

阿里这样的大公司背景支撑再加上 @勾三股四 这样的技术大牛带队，未来的 Weex 不可限量！

12 、 Ant Design

作者:蚂蚁金服

官网:https://ant.design/

Github:https://github.com/ant-design/ant-design

Star:9300+

最近更新:v2.6.0 （ 2017.1.1 ）

介绍:这是一款基于 React 的 UI 组件库，主要是负责开发和服务于企业级后台产品。通过 Github 上的介绍，这个项目是偏右（阿里的前端大牛）和 yiminghe （阿里的前端大牛+1 ）主导·，而且从 Ant Design 中也不难看出有些部分是来自 yiminghe 参与过的 GitHub 项目 react-component 。

这样的强强联手，再加上 React 大行其道今天，还有玉伯团队全明星般的号召力，这个项目后面必然会火得一塌糊涂。

13 、 Amaze UI

作者:云适配

官网:http://amazeui.org/

Github:https://github.com/amazeui/amazeui

Star:8600+

最近更新:v2.7.2 （ 2016.8.17 ）

介绍:Amaze UI 是国内首款开源前端框架，也是率先提出移动优先理念的框架之一，在 2016 年 Amaze UI 相继推出了针对移动端的 Touch 版，还与阿里钉钉合作推出了钉钉版，另外在 2017 年年初将迎来 3.0 版的重大更新，据说是全新界面，全新设计，是不是有点小激动？另外，还会有一个针对企业系统开发的版本，貌似也在秘密研发中，值得期待一下。

14 、 Knockout

作者:SteveSanderson 等技术人员

官网:http://knockoutjs.com/

Github:https://github.com/knockout/knockout

Star:7900+

最近更新:v3.4.1 （ 2016.11.8 ）

介绍:Konckout 是以兼容性著称的前端框架，因为他支持一些老版本的 IE （ IE6-IE8 ）的特性，能够让一些企业开发者免于在浏览器兼容性问题上浪费时间，但因为兼容 IE6 等老版本的 IE ，所以需要用 observable 才能双向绑定，而且他相比 Angular 更轻量级。

Konckout 在众多前端轮子面前也在逐渐的发展出自己的组件化思路，目前跟 Vue 比较类似，偏向于视图层的组件化 MVVM 框架，如果你想要兼容老版本 IE 浏览器并且兼顾 PC 和移动端，不妨试试他。

15 、 Element

作者:饿了么前端技术团队

官网:http://element.eleme.io/

Github:https://github.com/ElemeFE/element

Star:6700+

最近更新:v1.1.2 （ 2016.12.30 ）

介绍:Element ，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的组件库，提供了配套设计资源，帮助你的网站快速成型。由于目前 Vue 的大红大紫，导致了很多衍生库的出现，饿了么前端技术团队出的这套是基于最新的 Vue 2.0 的组件库，方便了很多使用 Vue 的开发者能够快速开发。

有饿了么这个大公司的背景作支撑，后续的维护应该不用担心，虽然只是一个 Vue 的衍生组件库，但是其质量颇高，可读性也较好。

16 、 avalon

作者:qinerg

官网:http://avalonjs.coding.me/

Github:https://github.com/RubyLouvre/avalon

Star:4100+

最近更新:v2.2.4 （ 2017.1.4 ）

介绍:avalon 是一个功能强大，体积小巧的 MVVM 框架。它遵循操作数据即操作 DOM 的理念，让你在代码里基本见不到一点 DOM 操作代码。 DOM 操作全部在绑定后，交给框架处理。相当后端有了 ORM 一样，不用你手写 SQL ，提高生产力！ 与其它 js 框架相比，同样实现著名的 todos 功能，在所有 MV的实现中 avalon 是让用户写代码最少的。与其他 MV相比，它不仅轻量，最低支持到 IE6 ，而且性能是最好的。

17 、 svelte

作者:Rich Harris

官网:https://svelte.technology/

Github:https://github.com/sveltejs/svelte

Star:3800+

最近更新:v1.6.3 （ 2017.1.4 ）

介绍:这款框架是在 2016 年下半年最新发布的，作者是 Rich Harris ，也就是 Ractive, Rollup 和 Buble 的作者， Svelte 的核心思想在于『通过静态编译减少框架运行时的代码量』。当前的框架无论是 React Angular 还是 Vue ，不管你怎么编译，使用的时候必然需要『引入』框架本身，也就是所谓的运行时 (runtime)。但是用 Svelte 就不一样，一个 Svelte 组件编译了以后，所有需要的运行时代码都包含在里面了，除了引入这个组件本身，你不需要再额外引入一个所谓的框架运行时！（部分内容摘自知乎 Vue 作者尤雨溪回答）

出自前端轮子哥之手的新型框架，从中可以看到很多与现有的框架相同之处，但也有他的优势所在，因为他可以用来编译可独立分发的 Web Components ，而这个规范也在逐渐的成为前端的主流！

18 、 T3js

作者:box

官网:http://t3js.org/

Github:https://github.com/box/t3js

Star:1500+

最近更新:v2.7.0 （ 2016.8.27 ）

介绍:T3js （ t3.js ）与 MVC 框架不同， T3 是建立在可伸缩 JavaScript 应用体系结构的概念之上来创建松耦合、少模型的系统，以此来创建大型 JavaScript 应用。 T3 可以与其他框架一起工作后，创建和转换组件变得很容易，而不用停止重新编写整个客户端。

T3 的设计完全遵循可扩展 JavaScript 应用体系结构相关原则，尤其是组件间强调松耦合、依赖透明化、为不明确的需求留有扩展点以备扩展、抽象出共同点等原则。 T3 的创建目的是鼓励开发者编写一些小且用途单一的组件，继而创建出扩展性比较强的客户端代码。

19 、 ZUI

作者:禅道项目管理软件团队

官网:http://zui.sexy/

Github:https://github.com/easysoft/zui

Star:1200+

最近更新:v1.5 （ 2016.9.6 ）

介绍:ZUI 继承了 Bootstrap 3 中的大部分基础内容，但出于与 Bootstrap 不同的目的大部分内容都进行了定制和修改。其中包含，移除了部分插件的限制，增加了卡片、评论、列表等实用的视图插件。 你可以把 ZUI 看成是 Bootstrap 的补全完善版，如果认为 Bootstrap 不能够很好的满足你，不妨试试这个。

20 、 Dojo

作者:Dylan Schiemann

官网:https://dojotoolkit.org/

Github:https://github.com/dojo/dojo

Star:957

最近更新:v1.12.1 （ 2016.12.21 ）

介绍:这是一款针对企业级应用的前端框架，目前已应用于 IBM 等大企业，主要分为 dojo,dijit,dojox 三个大模块，前者包括 oop 模拟，各种常用功能的处理，如： declare.js lang, request 等；中间是 ui 层各种组件的实现，如：边框容器，时间日期等；后者是常用组件功能的扩展，如：列表 table ，图表等；也正是因为他的企业级属性，所以过于“厚重”。