我排除掉了一切有问题的实现，然后选出Github星级最多的前20个库。关于具有多个版其他库，我选的是它们的最新版别和没有运用第三方库的功能最高的分支。
Vue（177k）
React（161k）
Angular（68.9k）
Svelte（40.5k）
Preact（27.9k）
Ember（21.7k）
HyperApp（18.2k）
Inferno（14.6k）
Riot（14.4k）
Yew（14.2k）
Mithril（12.5k）
Alpine（12.4k）
Knockout（9.9k）
Marko（9.9k）
Rax（7k）
lit-html（6.9k）
Elm（6.2k）
Ractive（5.8k）
Solid（4.7k）
Imba（4.1k）
留意：关于lit-html，我用的是LitElement实现，由于规范版标记了一个问题。它的开支应该很小，由于它是包装在单个Web组件中的原始lit-html。
这是当下Web开发生态系统中十分优秀的一组选手。尽管Github星级并不能完全阐明问题，但测试成果里有100多个库，因而我需要一个规范来选出参赛者。
每个库都会参与三大类其他比照：DOM功能、发动目标和内存运用情况。此外，我会将这些框架分为4组，这样就能更好地同功能附近的对手比照了。但我也会给出三大类其他总排名。
在每一组中都会有作为参考的规范Java条目。这一实现运用了一切最优秀的技术来做优化，以实现最佳功能。它将作为一切比照的基线。
9大前端框架详解
现在的前端已经不再像以前相同便是简略的写写页面和调调款式而已，现在的前端越来越杂乱，常识点越来越丰厚。
要做WEB前端，就需求知道前端究竟是什么，需求学习那些常识；前端至少要懂的三个部分：HTML，CSS，JavaScript（简称JS），那首先先清晰这三个概念：
HTML担任结构，网页想要表达的内容由html书写。
CSS担任款式，网页的美与丑由它来控制
JS担任交互，用户和网页发生的互动由它来控制。
web前端开展至今，演化出了无数的库和结构；说到库榜首时刻想到的是不是jquery？在小编刚接触库的时分也是从jQuery开端的；今日咱们就来说说前端开展到现在都有哪些好用的库结构。
2016年开端应该是互联网飞速开展的几年，一同也是Web前端开发十分火爆的一年，Web前端技能开展速度让人感觉简直不是继承式的迭代，而是一次次的变革和发明。这一年中有许多热门的前端开发结构，下面源码时代web小编为咱们总结2016年至今最受欢迎的几款前端结构。
在这互联网飞速开展的信息时代，技能的更新迭代也在加速。现在看来，火了十几年的Java技能现在仍然是棵常青树。回想两年前初来咋到，也是想好好当一名java程序员，五年计划都行想好了，最后仍是阴差阳错搞了前端。前端现在来看仍是十分火的，跟着IT技能的百花齐放，新的前端结构不断推出，但大多都还在狂吼的阶段。其实一直以来对技能的理解是技能服务于事务和产品，产品又在不同程度的推动着技能的演进。Web、无线、物联网、VR、PC从不同方向推动着技能的融合与微创新。程序员在不同事务场景下的人物互换。而跟着Node.js的呈现言语的人物也在发生着改变，js扮演了越来越重要的人物。也就有了茶余酒后也把了解到的常识整理一下。
一、前端UI结构组件库：
说到前端结构我榜首印象中想起React、Vue和Angular，不知道你是否与我相同想到这些，现在常用的有：Bootstrap、jQueryUI、BootMetro、AUI常用的还有许多、就不一一跟咱们举例出来了，由于许多朋友以为在不同项目开发中用到的前端结构不相同，其实也有一款能够适用于多种项目开发的前端结构，只是没发现。
用前端结构开发项目的原因？
这个应该是最好解决的问题，首先便是削减造轮子的主意，能够快速的开发一款web运用对于公司来说都是十分乐意开到的，在时刻和本钱之间就能够节省许多的时刻，这是其间一点，别的一点便是运用前端结构的组件功用，只要组件功用强壮，什么样的项目都能够开发（前提是：要熟悉前端结构的功用！），时刻本钱问题就能够轻松解决。
没有规划师也能做出精巧页面作用的前端结构
尽管商场中有许多的前端结构，但部分UI结构是归于组件库，然而QUICKUI跟当下盛行的三大底层结构React、Vue和Angular不同，QUICKUI供给了一整套前端解决方案，包含前后端别离的开发结构、100多种功用强壮的UI控件、几十套精巧的皮肤模板和近16万字的开发文档，满足你所以开发项目都不是问题。
二、前端结构库：
1.Node.Js
地址：http://www.runoob.com/nodejs/nodejs-tutorial.html(中文网)
描绘：Node.js是一个Javascript运转环境(runtime)。实践上它是对GoogleV8引擎进行了封装。V8引擎执行Javascript的速度十分快，功用十分好。Node.js对一些特殊用例进行了优化，供给了代替的API，使得V8在非浏览器环境下运转得更好。
Node.js是一个依据ChromeJavaScript运转时树立的渠道，用于方便地搭建呼应速度快、易于扩展的网络运用。Node.js运用事情驱动，非堵塞I/O模型而得以轻量和高效，十分合适在分布式设备上运转数据密集型的实时运用。
简略的说node.js便是运转在服务端的JavaScript。
Node.js是一个依据Chromejavascript运转时树立的一个渠道。
Node.js是一个事情驱动I/O服务端JavaScript环境，依据Google的V8引擎，V8引擎执行Javascript的速度十分快，功用十分好。
用处：
1.RESTfulAPI（现在比较盛行的接口开发风格）
这是NodeJS最理想的运用场景，能够处理数万条衔接，本身没有太多的逻辑，只需求恳求API，安排数据进行回来即可。它本质上只是从某个数据库中查找一些值并将它们组成一个呼应。由于呼应是少数文本，入站恳求也是少数的文本，因而流量不高，一台机器乃至也能够处理最繁忙的公司的API需求。
2.统一Web运用的UI层
现在MVC的架构，在某种意义上来说，Web开发有两个UI层，一个是在浏览器里面咱们终究看到的，另一个在server端，担任生成和拼接页面。
不讨论这种架构是好是坏，可是有别的一种实践，面向服务的架构，更好的做前后端的依靠别离。假如一切的要害事务逻辑都封装成REST调用，就意味着在上层只需求考虑怎么用这些REST接口构建具体的运用。那些后端程序员们根本不操心具体数据是怎么从一个页面传递到另一个页面的，他们也不必管用户数据更新是通过Ajax异步获取的仍是通过改写页面。
3.许多Ajax恳求的运用
例如个性化运用，每个用户看到的页面都不相同，缓存失效，需求在页面加载的时分主张Ajax恳求，NodeJS能呼应许多的并发恳求。总而言之，NodeJS合适运用在高并发、I/O密集、少数事务逻辑的场景。
2.angular.Js（比较厉害，github排名也比较高）
地址：http://www.runoob.com/angularjs/angularjs-tutorial.html(中文网)
描绘：AngularJS[1]诞生于2009年，由MiskoHevery等人创立，后为Google所收买。是一款优异的前端JS结构，已经被用于Google的多款产品当中。AngularJS有着许多特性，最为中心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依靠注入等等。
用处：通过描绘咱们应该就能很好的理解AngularJS的真实用处了，MVVM，模块化，自动化双向数据绑定等等。除了简略的dom操作外，更能表现Js编程的强壮。当然运用应该视场合而定。
它的呈现比较早，也是从前比较盛行的前端js结构，可是今年来跟着reactJS与VueJS的呈现，它的热度在渐渐降低。
3.JQueryMobile
地址：http://www.w3school.com.cn/jquerymobile/(中文网)
描绘：QueryMobile是jQuery在手机上和平板设备上的版别。jQueryMobile不仅会给干流移动渠道带来jQuery中心库，并且会发布一个完整统一的jQuery移动UI结构。支撑全球干流的移动渠道。jQueryMobile开发团队说：能开发这个项目，咱们十分振奋。移动Web太需求一个跨浏览器的结构，让开发人员开发出真实的移动Web网站。
用处：jQueryMobile是创立移动web运用程序的结构。
jQueryMobile适用于一切盛行的智能手机和平板电脑。
jqueryMobile运用HTML5和CSS3通过尽可能少的脚本对页面进行布局。
4.requirejs
地址：http://www.requirejs.cn/
描绘：RequireJS的目标是鼓励代码的模块化，它运用了不同于传统
用处：模块化动态加载。
5.Vue.js(现在商场上的干流)
地址：http://cn.vuejs.org/
描绘：Vue.js是用于构建交互式的Web界面的库。它供给了MVVM数据绑定和一个可组合的组件体系，具有简略、灵敏的API。从技能上讲，Vue.js集中在MVVM方法上的视图模型层，并通过双向数据绑定衔接视图和模型。实践的DOM操作和输出格局被笼统出来成指令和过滤器。比较其它的MVVM结构，Vue.js更简略上手。
现在商场上比较盛行的前后端别离的开发方法，大多前端都是vueJS做的，具体的优点请咱们看官方文档。
6.backbone.js
地址：http://www.css88.com/doc/backbone/
描绘：Backbone为杂乱Javascript运用程序供给模型(models)、调集(collections)、视图(views)的结构。其间模型用于绑定键值数据和自定义事情；调集附有可枚举函数的丰厚API；视图能够声明事情处理函数，并通过RESTfulJSON接口衔接到运用程序。
7.React.js（gihub排名仅次于vue.js）
地址：http://reactjs.cn/react/docs/why-react.html
描绘：React是一个Facebook和Instagram用来创立用户界面的JavaScript库。许多人以为React是MVC中的V（视图）。咱们发明React是为了解决一个问题：构建跟着时刻数据不断改变的大规模运用程序。为了达到这个目标，React选用下面两个首要的思想。
8.AmazeUI
AmazeUI是轻量级的前端运用结构，是国内比较盛行的结构，比较适用于移动端呼应式开发结构，能够按照项目要求生成专属的UI结构库进行运用，组件十分丰厚，能够构建出美丽的web页面。
官网地址：http://amazeui.org/
三、可视化组件
1.Echarts
地址：http://echarts.baidu.com/
描绘：ECharts，一个纯Javascript的图表库，能够流畅的运转在PC和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依靠轻量级的Canvas类库ZRender，供给直观，生动，可交互，可高度个性化定制的数据可视化图表。
2.tableau(收费)
地址：http://www.yuandingit.com/special/tableau/index.html
描绘：Tableau是桌面体系中最简略的商业智能工具软件，Tableau没有逼迫用户编写自定义代码，新的控制台也可彻底自定义装备。在控制台上，不仅能够监测信息，并且还供给完整的剖析能力。Tableau控制台灵敏，具有高度的动态性。
四、前端构建工具
1.gulp
地址：
描绘：易于运用
通过代码优于装备的战略，Gulp让简略的使命简略，杂乱的使命可管理。
构建快速
利用Node.js流的威力，你能够快速构建项目并削减频频的IO操作。
插件高质
Gulp严格的插件指南确保插件如你期望的那样简练高质得作业。
易于学习
通过最少的API，把握Gulp毫不费力，构建作业尽在把握：好像一系列流管道。
2、ESorwebPackage
1.Bootstrap中文网
先共享下，假如有想一同学习web前端，HTML5及JavaScript的能够来一下我的前端群733581373，老友都会在里面沟通，共享一些学习的方法和需求留意的小细节，每天也会按时的讲一些前端的炫酷特效，及前端直播课程学习
Bootstrap，让你的页面更简练、直观、强悍、移动设备优先的前端开发结构,让web开发更迅速、更简略。它还供给了更高雅的HTML和CSS标准，它即是由动态CSS言语Less写成。有着丰厚的网格布局体系以及丰厚的可重用组件，还有强壮的支撑十几的JavaScript、jQuery插件以及组件定制等。
Bootstrap中文网地址：http://www.bootcss.com/
2.Layui
layer是一款口碑极佳的web弹层组件，是一款选用本身模块标准编写的前端UI结构，遵从原生HTML/CSS/JS的书写与安排方法，门槛极低，拿来即用。layui首个版别发布于2016年秋，她差异于那些依据MVVM底层的UI结构，从中心代码到API的每一处细节都通过精心雕刻，十分合适界面的快速开发。
Layui官网地址：https://www.layui.com/
3.ElementUI
Element-Ul是饿了么前端团队推出的一款依据Vue.js2.0的桌面端UI结构，手机端有对应结构是MintUI。合适于Vue的UI结构；
官网地址：http://element-cn.eleme.io/#/zh-CN
4.MintUI
MintUI是由饿了么前端团队推出的一个依据Vue.js的移动端组件库，MintUI包含丰厚的CSS和JS组件，能够满足日常的移动端开发需求。通过它，能够快速构建出风格统一的页面，提升开发功率。
官网地址：http://mint-ui.github.io/
5.angular
AngularJS诞生于2009年,由MiskoHevery等人创立,后为Google所收买。是一款优异的前端JS结构,已经被用于Google的多款产品当中。AngularJS有着许多特性，最为中心的是MVW（Model-View-Whatever）、模块化、自动化双向数据绑定、语义化标签、依靠注入等等。
官网地址：http://www.angularjs.net.cn/
6.React
React能够十分轻松地创立用户交互界面。为你运用的每一个状态规划简练的视图,在数据改变时React也能够高效地更新渲染界面。React起源于Facebook的内部项目，由于该公司对商场上一切JavaScriptMVC结构，都不满足，就决定自己写一套，用来架起Instagram的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。
官网地址：http://react-china.org/
7.vue.js
近几年最火的前端结构当属Vue.js了，Vue.js是一个构建数据驱动的web界面的渐进式结构。Vue.js的目标是通过尽可能简略的API完成呼应的数据绑定和组合的视图组件。许多运用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。颁发了这么高的评价的vue.js，也是开源世界华人的骄傲，由于它的作者是位中国人–尤雨溪
几款常用的高质量web前端结构
Web前端结构便是为了节省开发本钱和时刻，一般开发一个项目都会用到前端结构（除非自己有前端开发团队），依据我经验找的几款web前端结构做出了剖析。都是个人意见，仁者见仁智者见智。
QUICKUI
QUICKUI是一套完整的企业级web前端开发解决方案，由基础结构、UI组件库、皮肤包、示例工程和文档等组成。运用QUICKUI开发者能够极大地削减作业量，进步开发功率，快速构建功用强壮、美丽、兼容的web运用体系。
QUICKUI优势：
①功用最为强壮
QUICKUI阅历了7年的迭代更新，不断从客户的各种事务中对组件的需求进行归纳和抽离，然后打造新的组件和功用。现在最新的4.0版别结构包含了一百多种组件，一千多个运用场景示例。能够说在前端结构领域中，QUICKUI具有功用最强壮组件库。
②运转最为稳定
许多其他的第三方UI控件在简略场合运用OK，到了杂乱的场景中就会呈现许多问题，这种现象很常见，由于在组件规划时无法预料到一切的运用场合。而QUICKUI在7年间阅历了数千个项目实践检验，在各种杂乱场景都运用过，并依据客户的反馈不断完善和调整。现在的第四代能够说是最稳定、最完美的版别。
③丰厚精巧的界面皮肤
跟其他web前端结构仅仅是一套组件库不同，QUICKUI是一整套前端解决方案，具有丰厚的外观界面解决方案。选用现今盛行的扁平化规划理念，推出了包含登录、呼应式web、作业桌面、地图类、门户风格、大屏展现风格等等几百套制造精巧、用户体会优异的界面。这些界面是以QUICKUI皮肤包的方法发布，运用和更换都十分方便。
④事无巨细的开发文档
QUICKUI具有16万字+的开发文档，结构和组件的每一个功用点都有详细的解说和代码示例，用于开发过程中随时查阅。除了结构机制解说和组件运用教程，文档还触及web前端开发的许多常识。仔细阅读并结合结构运用的话，你很快就能成为web开发的高手。
⑤上手开发十分简略
QUICKUI选用组件化思想来构建组件，一个组件便是一两句html的标签，运用起来十分简略。将开发人员从繁琐的JS编码中摆脱出来，很大程度削减前台编码的出错率；保留了HTML的布局方法，然后快速进行页面布局。对开发者前台技能要求也十分低，只需求了解html语法和一些简略的JS即可，然后把更多精力放在事务功用的完成上，极大地进步开发功率。
⑥浏览器兼容性十分好
QUICKUI4.0运用了许多HTML5，CSS3技能用于进步表现力和用户体会，这些新的特性在现代浏览器中会有很好的作用。可是，国内依然有许多的用户在运用IE7、IE8等旧时代的浏览器，为照顾这部分用户，结构选用了渐进式思想，确保低版别浏览器也能正常运用。所以，QUICKUI兼容IE7以上一切干流浏览器。
flex
Apache基金会今日发布了Flex4.8版别，这是Adobe将Flex捐献给Apache基金会后发布的榜首个版别。
需求留意的是，Flex现在还在孵化阶段，还不是Apache的正式项目，Flex4.8也不是一个正式的Apache版别。
Apache称，该版别标志着Flex新时代的开端，Flex的未来将由社区来驱动，而不是由一个公司驱动。开发者能够通过贡献代码，来协助改善Flex，如修正bug、添加功用等。
从Macromedia卖给Adobe，然后又捐给apache，不知道搞什么名堂。不过还好没有通过大幅重构，否则就真的是悲痛了！
extjs
ExtJS是一种首要用于创立前端用户界面，是一个基本与后台技能无关的前端ajax结构。
功用丰厚，无人能出其右。
无论是界面之美，仍是功用之强，ext的表格控件都高居榜首。
华丽的界面，灵敏的功用，还有开发工具都是配套的，但有个最大的问题，用就得花钱！
easyui
easyui协助你构建你的web运用愈加简略。
它是一个依据jquery的插件，开发出来的一套轻量级的ui结构，十分小巧并且功用丰厚。
可是她有一个最大的问题便是代码只能找到以前的开源的版别，到了1.2以后的版别源代码都是通过混淆的，假如遇到问题修正起来会十分麻烦！不过一个比较大的优势是开源免费，并且界面做的还说的曩昔！
jQueryUI
jQueryUI是一套jQuery的页面UI插件，包含许多种常用的页面空间，例如Tabs（如本站主页右上角部分）、拉帘作用（本站主页左上角）、对话框、拖放作用、日期选择、颜色选择、数据排序、窗体大小调整等等十分多的内容。功用十分全面，界面也挺美丽的，能够全体运用，也能够分开运用其间的几个模块，免费开源！
MiniUI
又一个依据jquery的结构，开发的界面功用都很丰厚。
jQueryMiniUI–快速开发WebUI。
它能缩短开发时刻，削减代码量，使开发者更专心于事务和服务端，轻松完成界面开发，带来绝佳的用户体会。
运用MiniUI，开发者能够快速创立Ajax无改写、B/S快速录入数据、CRUD、Master-Detail、菜单工具栏、弹出面板、布局导航、数据验证、分页表格、树、树形表格等典型WEB运用体系界面。
界面做的挺不错，功用也挺丰厚，可是有两个比较大的问题，一个是收费，一个是没有源码，说白了，不开源！依据这个开发假如想对功用做扩展就需求找他们的团队进行晋级！
DWZ
DWZ富客户端结构(jQueryRIAframework),是中国人自己开发的依据jQuery完成的AjaxRIA开源结构.
规划目标是简略实用,快速开发,降低ajax开发本钱。
欢迎咱们提出主张，咱们将在下一版别中进一步调整和完善功用．一起推动国内全体ajax开发水平。
毕竟是国产的，支撑一下，并且源码彻底公开，能够选择一下！不过功用怎么样不敢确认！
YUI
Yahoo!UILibrary(YUI)是一个开放源代码的JavaScript函数库，为了能树立一个高互动的网页，它选用了AJAX,DHTML和DOM等程式码技能。它也包含了许多CSS资源。运用授权为BSD许可证，基本上没怎么研究过！YUICompressor倒是挺知名的，这套UI库不知道运用的情况怎么样！
