前端js框架汇总

时间 2019-11-11

原文原文链接

前端Js框架汇总

概述：

　　有些日子没有正襟危坐写博客了，互联网飞速发展的时代，技术更新迭代的速度也在加快。看着Java、Js、Swift在各领域心花路放，也是煞是羡慕。寻了寻.net的消息，也是振奋人心，.net core 1，mono，xamarin等等，但大多都还在狂吼的阶段。其实一直以来对技术的理解是技术服务于业务和产品，产品又在不一样程度的推动着技术的演进。css

　　Web、无线、物联网、VR、PC从不一样方向推动着技术的融合与微创新。程序员在不一样业务场景下的角色互换。而随着node.js的出现语言的角色也在发生着转变，Js扮演了愈来愈重要的角色。也就有了茶余饭后也把了解到的知识整理一下。看过“你的知识须要管理”后，强烈的意识到杂乱且范范的知识储备远不如整理后条理清晰的知识带来好处多。因此，是的，咱们须要时不时的回来对掌握的知识梳理归类，以备不时之需。html

1、前端框架库：

1.Zepto.js

地址：http://www.css88.com/doc/zeptojs/
描述：Zepto是一个轻量级的针对现代高级浏览器的JavaScript库，它与jquery有着相似的api。若是你会用jquery，那么你也会用zepto。关于Zepto认知我也是经过与一位腾讯朋友聊天的时候知道的，只做了些基础的了解。

2.SUI Mobile

地址：http://m.sui.taobao.org
描述：SUI Mobile 是一套基于 Framework7 开发的UI库。它很是轻量、精美，只须要引入咱们的CDN文件就可使用，而且能兼容到 iOS 6.0+ 和 Android 4.0+，很是适合开发跨平台Web App。
用途：你也看到了，他是用于无线端的Web App的开发。

3.Node.Js

地址：http://www.runoob.com/nodejs/nodejs-tutorial.html (中文网)
描述：Node.js是一个Javascript运行环境(runtime)。实际上它是对Google V8引擎进行了封装。V8引擎执行Javascript的速度很是快，性能很是好。Node.js对一些特殊用例进行了优化，提供了替代的API，使得V8在非浏览器环境下运行得更好。

　　Node.js是一个基于Chrome JavaScript运行时创建的平台，用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动，非阻塞 I/O 模型而得以轻量和高效，很是适合在分布式设备上运行数据密集型的实时应用。

　　简单的说 Node.js 就是运行在服务端的 JavaScript。前端

　　Node.js 是一个基于Chrome JavaScript 运行时创建的一个平台。vue

　　Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度很是快，性能很是好。node

用途：

　　1. RESTful APIreact

　　这是NodeJS最理想的应用场景，能够处理数万条链接，自己没有太多的逻辑，只须要请求API，组织数据进行返回便可。它本质上只是从某个数据库中查找一些值并将它们组成一个响应。因为响应是少许文本，入站请求也是少许的文本，所以流量不高，一台机器甚至也能够处理最繁忙的公司的API需求。jquery

　　2. 统一Web应用的UI层git

　　目前MVC的架构，在某种意义上来讲，Web开发有两个UI层，一个是在浏览器里面咱们最终看到的，另外一个在server端，负责生成和拼接页面。程序员

不讨论这种架构是好是坏，可是有另一种实践，面向服务的架构，更好的作先后端的依赖分离。若是全部的关键业务逻辑都封装成REST调用，就意味着在上层只须要考虑如何用这些REST接口构建具体的应用。那些后端程序员们根本不操心具体数据是如何从一个页面传递到另外一个页面的，他们也不用管用户数据更新是经过Ajax异步获取的仍是经过刷新页面。angularjs

　　3. 大量Ajax请求的应用

例如个性化应用，每一个用户看到的页面都不同，缓存失效，须要在页面加载的时候发起Ajax请求，NodeJS能响应大量的并发请求。　　总而言之，NodeJS适合运用在高并发、I/O密集、少许业务逻辑的场景。

4.angular.Js

地址：http://www.runoob.com/angularjs/angularjs-tutorial.html (中文网)
描述：AngularJS[1] 诞生于2009年，由Misko Hevery 等人建立，后为Google所收购。是一款优秀的前端JS框架，已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。
用途：经过描述咱们应该就能很好的明白AngularJS的真实用途了，MVVM，模块化，自动化双向数据绑定等等。除了简单的dom操做外，更能体现Js编程的强大。固然应用应该视场合而定。

5.JQuery Mobile

地址：http://www.w3school.com.cn/jquerymobile/ (中文网)
描述：Query Mobile是jQuery 在手机上和平板设备上的版本。jQuery Mobile 不只会给主流移动平台带来jQuery核心库，并且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说：能开发这个项目，咱们很是兴奋。移动Web太须要一个跨浏览器的框架，让开发人员开发出真正的移动Web网站。
用途：jQuery Mobile 是建立移动 web 应用程序的框架。

　　　　　　jQuery Mobile 适用于全部流行的智能手机和平板电脑。

　　　　　　jQuery Mobile 使用 HTML5 和 CSS3 经过尽量少的脚本对页面进行布局。

6.requirejs

地址：http://www.requirejs.cn/
描述：RequireJS的目标是鼓励代码的模块化，它使用了不一样于传统<script>标签的脚本加载步骤。能够用它来加速、优化代码，但其主要目的仍是为了代码的模块化。它鼓励在使用脚本时以module ID替代URL地址。

RequireJS以一个相对于baseUrl的地址来加载全部的代码。页面顶层<script>标签含有一个特殊的属性data-main，require.js使用它来启动脚本加载过程，而baseUrl通常设置到与该属性相一致的目录。

用途：模块化动态加载。

7.Vue.js

地址：http://cn.vuejs.org/
描述：Vue.js 是用于构建交互式的 Web 界面的库。它提供了 MVVM 数据绑定和一个可组合的组件系统，具备简单、灵活的 API。从技术上讲， Vue.js 集中在 MVVM 模式上的视图模型层，并经过双向数据绑定链接视图和模型。实际的 DOM 操做和输出格式被抽象出来成指令和过滤器。相比其它的 MVVM 框架，Vue.js 更容易上手。

8.backbone.js

地址：http://www.css88.com/doc/backbone/
描述：Backbone 为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构。其中模型用于绑定键值数据和自定义事件；集合附有可枚举函数的丰富API；视图能够声明事件处理函数，并经过RESTful JSON接口链接到应用程序。

9.React

地址：http://reactjs.cn/react/docs/why-react.html
描述：React 是一个 Facebook 和 Instagram 用来建立用户界面的 JavaScript 库。不少人认为 React 是 MVC 中的 V（视图）。咱们创造 React 是为了解决一个问题：构建随着时间数据不断变化的大规模应用程序。为了达到这个目标，React 采用下面两个主要的思想。

10.Ionic

地址：http://www.ionic.wang/js_doc-index.html
描述：Ionic既是一个CSS框架也是一个Javascript UI库。许多组件须要Javascript才能产生神奇的效果，尽管一般组件不须要编码，经过框架扩展能够很容易地使用，好比咱们的AngularIonic扩展。
Ionic遵循视图控制模式，通俗的理解和 Cocoa 触摸框架类似。在视图控制模式中，咱们将界面的不一样部分分为子视图或包含其余视图的子视图控制器。而后视图控制器“驱动”内部视图来提供交互和UI功能。一个很好的例子就是标签栏（Tab Bar）视图控制器处理点击标签栏在一系列可视化面板间切换。

浏览咱们的API文档来了解视图控制器和Ionic中可用的Javascript实用工具。

Ionic 是目前最有潜力的一款 HTML5 手机应用开发框架。经过 SASS 构建应用程序，它提供了不少 UI 组件来帮助开发者开发强大的应用。它使用 JavaScript MVVM 框架和 AngularJS 来加强应用。提供数据的双向绑定，使用它成为 Web 和移动开发者的共同选择。

2、前端UI框架

1.Pure

地址：http://purecss.org/layouts/
描述：Pure精心设计，只为能够在任何Web项目中使用。为了例证这一点，咱们制做了以下几个模板。这些模板都是响应式的，而且没有使用任何JavaScript。
用途：真的是很精美的一个样式框架，便于咱们快事构建一些我的产品，固然也能够服务于工做中的一些项目。

2.bootstrap

地址：http://www.bootcss.com/
描述：简洁、直观、强悍的前端开发框架，让web开发更迅速、简单。

3.EasyUI

地址：http://www.jeasyui.net/ (中文网)
描述：easyui是一种基于jQuery的用户界面插件集合。

　　　　　　easyui为建立现代化，互动，JavaScript应用程序，提供必要的功能。

　　　　　　使用easyui你不须要写不少代码，你只须要经过编写一些简单HTML标记，就能够定义用户界面。

　　　　　　easyui是个完美支持HTML5网页的完整框架。

　　　　　　easyui节省您网页开发的时间和规模。

　　　　　　easyui很简单但功能强大的。

4.Ant Design

地址：http://ant.design/
描述：一个 UI 设计语言，一套提炼和应用于企业级后台产品的交互语言和视觉体系

3、可视化组件

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控制台灵活，具备高度的动态性。

4、前端构建工具

1.gulp

地址：http://www.gulpjs.com.cn/
描述：易于使用

　　　　　　经过代码优于配置的策略，Gulp 让简单的任务简单，复杂的任务可管理。

　　　　　　构建快速

　　　　　　利用 Node.js 流的威力，你能够快速构建项目并减小频繁的 IO 操做。

　　　　　　插件高质

　　　　　　Gulp 严格的插件指南确保插件如你指望的那样简洁高质得工做。

　　　　　　易于学习

　　　　　　经过最少的 API，掌握 Gulp 绝不费力，构建工做尽在掌握：如同一系列流管道。

5、博客搭建

1.技术组合

　　HEXO+Github,搭建属于本身的博客。

　　站点：http://www.jianshu.com/p/465830080ea9

　　HEXO介绍：Hexo是一个开源的静态博客生成器,用node.js开发,做者是台湾大学生tommy351

　　准备：git + node.js + markdown编辑 + gitcafe + 域名

（借鉴别人的）