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

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

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

 

1

Bootstrap

做者:Twitter

官网: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

做者:Google

官网: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，图表等；也正是由于他的企业级属性，因此过于“厚重”。