ECMAScript14只完美 JS 前端框架、库、工具及其应用时

  这篇稿子要描述现今盛行的一对 Javascript web
前端框架,库和她的适用场景。

  新的 Javascript 库层出不穷,从而Web
社区越来越发活跃、多样、在差不多点迅速前进。详细去描述每一样种主流的 Javascript
框架和库近乎不可能,所以于马上首文章被着重介绍一些对准前者发展最富有影响力的前端框架。接下来给咱们来齐研究一些主流前端框架、库与工具,并讨论其的适
用场景。

  同时:

  如果该篇文章没有含你欣赏的 Javascript 框架,勿喷

  于行使前端框架进行支付时,建议维持版本更新。最新版本的貌似都见面供给再好的过浏览器,跨平台功能。
需检测某个框架的原本本子是否针对各种浏览器和设备的相当,请动
类似这个扫描器 的工具

  准备好了咔嚓,那么连下逐个讨论其。

  AngularJS

  Angular 是相同慢流行的营业所级
框架,很多程序员都用她来构建与维护复杂的网页应用。Angular
拥有巨大的人气,使用它的店铺和 Domino 的 Pizza 种类雷同多,如 Ryanair,
iTunes Connect, PayPal Checkout, Google。Angular 是一个由于 Google
支持的开源框架。Angular 称自己呢构建复杂网页应用而针对性 HTML
的恢宏。如果您为对 TypeScript 很熟稔,那么得望 怎样写 Angular 2 .

  Angular 采用 MVC 架构。它提供了 Model 层和 View
层之间再数据绑定。这种数量绑定方式的利是随便如何数据变动,都见面自动的换代两限的数额。这有助于你构建而吞食的
View
组件。它还提供了一个内外端服务好交互的劳动框架。最要害的凡,它是略的
JavaScript。

  什么时利用 AngularJS?
当你构建一个犬牙交错的网页前端采用并欲一个单身的模块框架去处理整个时。

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

  Current Version:1.4.7/1.2.29

  Website: angularjs.org

  二:React 是15年最好被欢迎的 JavaScript 项目!几乎人人都于讨论
ReactJS。去年,我到的诸一个会面几都见面来一两单话题探讨 React
和均等体系下的其余库( Flux , Redux ) 。React 是一个开源项目,几乎是出于
Fackbook 和任何主要的技能公司献出之。React
称自己为为构建用户接口而提供的 JavaScript 库。

  React 基本上用来当 MVC 中之 V。它完全专注让 MVC 中之 V
部分,而忽视了下被之任何一些架构。它提供了一个组件层,这叫咱爱制作UI元素并将这些UI元素组合在一起。它抽象出了DOM,因此一旦优化了渲染,
并允许而使用 node.js 渲染
React。另外,它实现了单纯为数交互流,这如她比任何的框架还爱理解以及应用。

  多单门类如 Angular ,Ember 绑定以 React 成为 MVC 中的 V。

  什么时候以 React?当您想只要产生一个强的 View
层,而用中之其余一些缺失不欲一个苛的框架时,或当你想要一个 View
层和您的 Angular, Backbone,或者
Ember应用一起用。当你试着构建一个同构的网页框架。

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

  时版本:v0.14.0

  网址: Facebook.github.io/react/

  Backbone

  Backbone 是
一个成名的简的框架,所有情节都得以放置一个纯粹的文本里。Backbone
已经流行了一段时间,其作者是 Jeremy Ashkenas,曾经由于开发了
CoffeeScript 和 Underscore 而为大家所理解。Backbone 特别适用于需要付出之
web 程序不深的那些组织,他们要会使小巧的框架,而未是如 Angular 或者
Ember 这样的重型框架。

  Backbone 提供了都职能的 MVC 框架和路由。它的 Model 可以兑现
key-value 绑定和数码更新的事件处理。Model(及 Collection)可以跟 RESTful
的 API 协同工作。View 可以声明事件处理,Router 在 URL
处理同状态管理方面做的怪好。对于开发一个单页面应用,所有需要的效果都可支撑,不欲分外引入无欲之繁杂。

  何时使用 Backbone?对于小型的 web 程序,Backbone 是我得择的框架。

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

  当前版本:1.2.3

  官方网站: backbonejs.org

  Ember 作为一个 web应用框架,非常专注于程序员的频率及。Ember
相对较盛行,核心团队发出成百上千充分明白的积极分子,包括 Yehuda Katz,他是 Ruby on
Rails 和 jQuery 的中坚团队的分子。Ember
对友好的一定是“一个就此来创造震撼的 web
应用之框架”,它也实在不见面浪费你的时刻。它在马上上头异常上心,为汝提供许多之挑选。

  Ember 同为是一个 MVC
的框架。它富含一个模板与视图引擎,在数据更新时可以自动更新,这上面与Angular,
Backbone, 和 React 类似。它还有一个 web 组件
的概念,允许你用自己之竹签扩展HTML,(如Angular)。它还有一个路由及 model
引擎,可以同 RESTful API 一起干活的要命好。

  何时使用
Ember?适用于你待一个框架马上就可知使用。对灵活性要求不强之上可选
Ember,因为您习以为常是预算紧张或工期紧张。

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

  当前本:2.1.0

  官方网站: emberjs.com

  JQuery
这个库房就甭多开牵线了。它独自承担了让超过浏览器网站成为现实的沉重,是它们叫整
web 成为今日之法。Web
标准的创制以及浏览器厂家针对正规的受地方,jQuery 功不可没。jQuery
基金会的靶子是”通过开源软件的付出和支撑,以及社区的合作,增进开放的网络,让每个人犹能够看”

  JQuery 是社会风气上应用最广大的 JavaScript
库,没有用可以离开它,除非你针对出效率不感兴趣。它使 DOM
遍历、事件处理、动画与 AJAX 在所有浏览器上且易得这样之简练好用。

  何时使用 jQuery?任何时刻,除非你打算利用还轻量级的本子,例如 Zepto

  GitHub: https://github.com/jquery/jquery

  当前版本:v1.11.3 或 v2.1.4

  官方网站: jquery.com

  Underscore 和 lodash

  有时坐的 JavaScript
对于让程序员真正的有生产力还远不够。总是会缺乏了一个家伙函数,又或者是一个能简化代码的函数。Underscore
(还有 lodash) 就是这么的一个 JavaScript
库,它提供了套器函数,无需经验不足的程序员再失为停放的 JavaScript
对象从补丁。两独仓库都提供了超 100
单援助函数,还产生其它特别的好东西;包括了像 map, filter, invoke, reduce,
template, throttle, bind, extend, pick, clone 等等这些函数。

  什么时用 Underscore?当你想要有所一个当即会增进程序员效率的
JavaScript 文件时。

  Underscore GitHub : https://github.com/jashkenas/underscore

  Underscore 当前版本:1.8.3

  Underscore 网站: underscorejs.org

  什么时候使用
lodash?当您想如果一个模块化的,性能更漂亮一点的,并附带有对于 AMD
和社区插件支持之 Underscore 版本时。

  Lodash GitHub: https://github.com/lodash/lodash

  Lodash 当前的本子:v3.10.1

  Lodash 网站: lodash.com

  D3.js

  数据可视化和图片是web应用程序的平栽正常需求。当提到到另外数操作和可视化时,D3.js
就是实际的专业。它是 GitHub
上无限受欢迎的品类有,并于数百只团机构所祭。大量之图纸、图标与可视化库都是构件被
D3 之上的。

  D3 让你得操作任何来自之多少文档,并以数据进行转移后采取至 DOM、SVG
和 CSS上。D3 专注于当代的 web 标准,以及确保您可免受任何像 Flash
或者 Silverlight 这样的专有格式的克。

  什么时利用 D3.js?当你用外项目的视觉效果的早晚。

  GitHub: https://github.com/mbostock/d3

  当前版本:3.5.6

  网站: d3js.org

   Babylon.js

  想使构建一个意运转于当代浏览器上,并且能够超越浏览器运行的视频游戏吧?那就是看看
Babylon.js 吧,它是一个 3D 游戏引擎,基于 WebGL 和
JavaScript。你可行使该大体、音频和粒子系统创造有过预期的赛质量游戏来。

  什么时候使用 Babylon.js?当您方构建一个视频游戏或者一个某种类型的
3D 场景时。

  GitHub: https://github.com/BabylonJS/Babylon.js

  当前版: 2.2

  网站: babylonjs.com

  Three.js

  想使构建一个 3D 视觉特效,但是还要休需要一个效能一体化的戏?Three.js
提供了一个轻量级的 3D 库,让您可以 3D 效果渲染成一个 HTML5 的 canvas,
SVG, 和 WebGL。这是一个详单简单的仓库,在 three.js
陈列站点及足见见数百只可以的言传身教。

  什么时候用 Three.js?当您得一个简的会出口为 Canvas 的 3D
视觉效果时。

  GitHub: https://github.com/mrdoob/three.js/

  当前版本: r73

  网站: threejs.org

  Mocha 和 Chai

  长久以来测试 JavaScript
一直还令人无生反感。说起来,测试外代码都是叫人反感的,但又倒是每个开发者应该做的作业。每个开发者似乎总是对之不屑,忽视掉对她的代码的测试工
作。 现在发出了痊愈这种反感的法了,那便是 Mocha 和
Chai。而简单个仓库都为美味的热饮命名,都能支援您测试代码,不过方式各异而已。

  Mocha 是一个 JavaScript
测试框架,它叫针对你的node模块或者浏览器采用中之异步代码的测试变得爱起来。Mocha
测试好拧起来运行,并且于对合适的测试案例进行大跟踪的质地对。

  Chai 是一个行令开发暨测试驱动开发的断言库,可与 Mocha
比肩。它为平等栽可读性好的品格来讲述而所而测试的东西,用起大概。

  什么时候用 Mocha 和 Chai?用他们不怕针对了!
请测试你的代码,让这世界变得重复好。

  Mocha GitHub: https://github.com/mochajs/mocha

  Mocha 当前版: 2.3.3

  Mocha 网站: mochajs.org

  Chai GitHub: https://github.com/chaijs/chai

  Chai 当前版本: v3.4.1

  Chai 网站: chaijs.com

  我们早已以这卖清单中包括了 Mocha 和 Chai
,如果无去把好运作这些测试或可能可以设定持续集成测试的测试运行器拉进来吧,那么就卖清单就未会见是完好的。Karma
是一个因此来帮助你当不同的浏览器中自行运行而的测试的工具。它用会见拉扯而当目前所有的浏览器上运行而的
Mocha 和 Chai 测试。

  并无是每个浏览器都见面运行为每个平台之上,不过幸运的凡发生过多免费之家伙而供应您用来测试外的浏览器,可以以
浏览器截屏 上看一样看。如果您是当 OS X 上运行以来,并且使测试的凡 Edge
或者 IE 的言语,你便可 免费 使用此家伙。

  什么时候以
Karma?当您想使享有一个作用完善的测试套件,并像确保测试能够于有着的浏览器上通过时。

  GitHub: https://github.com/karma-runner/karma

  当前本: v0.13

  网站: karma-runner.github.io

  PhantomJS

  运行总体底浏览器来测试你的代码是一旦凝聚消耗内存和 CPU 的。PhantomJS
让您得运行一个纯的 WebKit —— Safari 和 之前版本的 Chrome
中的渲染引擎(现在凡 Blink)。它能够被您通过一个 JavaScript API
来运行测试、截屏、模拟网络以及自动的浏览页面。

  什么时候以 PhantomJS
?当您待进行重新多的测试、操作网页和效仿网络要的操作时。

  GitHub: https://github.com/ariya/phantomjs

  当前本: v2.0

  网站: phantomjs.org

  Grunt 和 Gulp

  构建用于生产条件之网站一般还关乎到有升任性这面的天职,像
JavaScript 和 CSS 的太小化,CoffeeScript/TypeScript
的编译,单元测试,代码精简。也许你曾经有了一个家伙链,用于准备而生版本及的网站,而而您还没的话,就见面惦记要拥有一个像
Grunt 或者 Gulp
这样的职责运行器。它们都多之插件,能啊公的网站开展其他的转移,以使该能投入生产环境。

  什么时候使用
Grunt?当您再度愿编写配置文件,而对你的天职运行器会生成什么中间文件并无关心时。

  Grunt GitHub: https://github.com/gruntjs/grunt

  Grunt 当前版: v0.4.5

  Grunt 网站: gruntjs.com

  何时使用 Gulp?当您再次愿编写配置代码,并且想使用 node.js
的流处理能力实现又快之任务尽时。

  Gulp GitHub: https://github.com/gulpjs/gulp

  Gulp 当前版本: v3.9.0

  Gulp 网站: gulpjs.com

  Babel

  JavaScript 作为同样帮派语言发展非常便捷。ECMAScript 2015
在上年夏日宣告,而它的众初特点正在多时的浏览器被给实现。如果您想如果打听关于浏览器对
ECMAScript 2015 兼容信息,可以省是来自于 @kangax 的 表格
。你晤面小心到新型版本的 Edge,Firefox 和 Chrome 已经几乎是一点一滴的配合了。

  我们连无是在在一个到的社会风气中。作为开发者,我们用会见得连续支持老版本的浏览器,它们不具新型和极端精的
JavaScript 功能特色。而我辈实际是想念使更上一层楼我们的 web
并提升我们的代码库。Babel 就是一个 JavaScript 编译器,它可拿流行的
JavaScript 标准编译成兼容 ES5 的JavaScript,让您可于 IE9
那么老的浏览器上运行它们。它具有一些插件,让动用 React
开发尤其容易,设置会使用那些并无是标准 (例如 ES7) 的有的的意义特色。

  什么时使用 Babel?当你想如果动用初的 JavaScript
语言特色并且还要支持老的浏览器时。

  GitHub: https://github.com/babel/babel

  当前版: 6.1.2

  网站: babeljs.io

  更多 Web 开发之履行

  这篇稿子是 web 开发系列的同样有的,来自于 Microsoft
技术的传道者和工程师,内容都是有关实用的 JavaScript
学习、开源项目,还有互操作性最佳实践这些方面,包括了 Microsoft Edge
浏览器与初的 EdgeHTML 渲染引擎 。

  我们鼓励而于富有的浏览器和装备,包括作为 Windows 10 默认浏览器的
Microsoft Edge 上进行测试 —— 使用 dev.microsoftedge.com 上之免费工具:

  扫描你的站点上的老式的库,布局问题及可访问性

  下充斥免费的 Mac, Linux, 和 Windows 的虚拟机

  以备的浏览器,包括在 Microsoft Edge 上检讨 Web 平台的状态

  在你协调的设备及长途测试 Microsoft Edge

  更深切了解我们的工程师和传道者:

  GitHub 上之编码实验室:跨浏览器测试和特级实践

  Microsoft Edge Web 大会 2015 (来自于我们的工程团队和 JS 社区)

  哇哦,我能在 Mac 和 Linux 上测试 IE 和 Edge 了! (来自于 Rey Bango)

  没有破话 Web 的先进的 JavaScript (来自于)

  能让 Web 立刻从作用的 Edge 渲染引擎 (来自于 Jacob Rossi)

  使用 WebGL 发挥 3D 渲染之潜能 (来自于 David Catuhe)

  托 管web 应用以及web平台方面的更新 (来自于 Kevin Hill 和 Kiril
Seksenov)

  我们的社区开放源代码项目:

  vorlon.JS (多设备远程 JavaScript 测试)

  manifoldJS (部署超过平台托管 Web 应用)

  babylonJS (让 3D 图形这些东西又温和)

  更多免费之家伙和后端web开发的物ECMAScript:

  Linux, MacOS, 和 Window s 上运的 Visual Studio Code

  尝试当 Azure Cloud 上 使用 node.JS 编写代码