来自 奥门威尼斯网址 2019-09-21 03:38 的文章
当前位置: 威尼斯国际官方网站 > 奥门威尼斯网址 > 正文

库和工具,前端框架

至上的 JavaScript 前端框架、库和工具

2015/12/22 · JavaScript · 1 评论 · 工具, 库, 框架

本文由 伯乐在线 - cucr 翻译,Heiye 校稿。未经许可,禁止转发!
法语出处:Rami Sayar。款待插足翻译组。

类似差相当少每隔一周就有三个新的 JavaScript 库在网络社区挑起龙卷风!网络社区特别充满活力,两种化且在四个地点不慢上扬。调查每多个主流的 JavaScript 框架和库是不容许达成的壮举。由此,小编将享用部分前端开垦中最盛名和最有影响力的框架和库。让大家看看最棒的 JavaScript web 前端框架,库和工具以及几时使用它们。

另外:

  • 固然本身没有包含你最爱怜的 JavaScript 框架,请不要生气。
  • 长久难忘持续立异您的框架和库。最新版本的框架和库经常具备最佳的跨浏览器和跨设备的支撑。你能够使用工具, 比如scanner 来协理决断叁个旧版本是不是合作这一大批判设备。

好了,让我们进来列表!

  这篇小说重要描述到现在风行的有个别 Javascript web 前端框架,库以及它们的适用场景。

AngularJS

Angular 是风靡的厂家级框架,多数开辟人士都在使用它来构建和保卫安全复杂的 web 应用程序。Angular 的知名度十三分高,包罗 Domino’s Pizza, Ryanair, iTunes Connect, PayPal Checkout, 谷歌(Google)等公司都在选用它。Angular 是一个由谷歌(Google)协理的开源框架。Angular 自称是 HTML 的四个扩张,用来塑造复杂的 web 应用程序。其他若是您熟识 TypeScript, Angular 2就是用它创设的。

  新的 Javascript 库家常便饭,进而Web 社区愈发活跃、二种、在多地方迅Sylphy飞。详细去陈述每一类主流的 Javascript 框架和库近乎不只怕,所以在那篇小说中入眼介绍部分对前面八个发展最具影响力的前端框架。接下来让大家来一起商讨一些主流前端框架、库和工具,并探究它们的适 用场景。

其一小编的更加多文章

  • 营造三个基于 Node.js 的聊天室 Web App:远程调节和测量检验
  • 营造一个依据 Node.js 的聊天室 Web App:通过 WebSockets 连接

Angular 是一个 MVC 类型的框架。它提供了模型和视图之间的双向数据绑定。该数额绑定允许每当数据变动时,两侧自动更新。  它令你能够营造可复用的视图组件。它提供了一个劳务框架,使得后端-前端服务通讯更易于。最终,它只是一般的 JavaScript。

曾几何时使用 AngularJS?当您正在营造二个错综相连的 web 前端应用程序,同偶然候需求一个模块化的框架来管理任曾几何时。

GitHub: 
前段时间版本: 1.4.7/1.2.29
网址: angularjs.org

  同时:

React

React 是二零一三年最受款待的 JavaScript 项目!每一个人都就像是在座谈 ReactJS。2018年本人在场的每一个会议,至少有大多少个议题是有关 React 和同家族的别的库(Flux, Redux)的。React 是开源软件,首要由 推文(Tweet)开采,其余大型科学和技术集团也是有进献。React 自称是四个用来营造顾客分界面包车型大巴JavaScript 库。

React 首若是 MVC 中的 V。它的主要完全在 MVC 的 V 部分,忽视应用程序架构的其他部分。它提供了一个组件层,使得创建 UI 成分,组合成分变得更便于。它选用设想 DOM,由此优化了渲染,且允许从 node.js 渲染 React。其它,它完成了一边响应的数据流,因而比其余框架更易于驾驭和利用。

作为 MVC 中的 V,比非常多档次将 React 结合 Angular 或 Ember 那样的框架使用。

哪一天使用 React?当您想要二个强硬的视图层,但不必要在应用程序的别的部分使用一个头晕目眩的框架,或许您在 Angular、Backbone 或 Ember 应用上要求叁个视图层时。当你正试图创设一个同构 web 框架时。

 

GitHub: 
日前版本: v0.14.0
网址: Facebook.github.io/react/

  若是该篇小说未有包罗你欢愉的 Javascript 框架,勿喷

Backbone

Backbone 是八个有名的简短框架,适合单个 JavaScript 文件。Backbone 已经存在有一段时间了,是以 CoffeeScript 和 Underscore 有名的 JeremyAshkenas 所开拓的。对于一些为微型 web 应用找出一个布局轻易的框架,而不想引入如 Angular 或 Ember 那么些大型框架的团协会,Backbone 特别受迎接。

Backbone 提供多个完好无缺的 MVC 框架以及路由。模型允许键-值绑定和数量变动的事件管理。模型(和汇集)能够接二连三到RESTful API。视图具备申明式事件管理,路由在管理 U凯雷德L 和情景管理上做的很了不起。它满含你创立二个单页面应用程序所急需的上上下下,且从未提供太多东西,未有不供给的复杂度。

曾几何时使用 Backbone?Backbone 是自己创设简单 web 应用程序的首推框架。

GitHub: 

日前版本: 1.2.3
网站: backbonejs.org

  在运用前端框架举行开荒时,提议维持版本更新。最新版本的貌似都会提须求越来越好的跨浏览器,跨平台效应。 需检查评定有些框架的旧版本是还是不是对种种浏览器以及设备的匹配,请使用 类似这几个扫描器 的工具

Ember

Ember 是贰个顽固的 web 应用程序框架,关心技术员的工效。Ember 相比盛行,它的为主团队包蕴像曾是 Ruby on Rails 和 jQuery 宗旨团队成员的 Yehuda Katz 的智囊。Ember 自称是“一个用来创制大范围 web 应用程序的框架”,且不浪费你的日子。它很执着,为你提供了比很多摘取。

Ember 也是三个 MVC 框架。它总结一个模板和视图引擎,当数码变化时自动更新,就好像Angular,Backbone 和 React 一样。它饱含 web组件 的企图,让您采用本身标签扩张 HTML(就像Angular 同样)。它也可以有贰个驾驭什么样与您的 RESTful API 一齐坐班的路由和模型引擎。

几时使用 Ember?当您只需求一个方可运转的框架时。当你因为预算恐慌或工期不够长而无需灵活性时,请使用 Ember。

GitHub: 
前段时间版本: 2.1.0
网站: emberjs.com

  筹算好了吧,那么接下去各个探究它们。

jQuery

jQuery 是三个不必介绍的库。它凭一己之力让跨浏览器网址选取成为实际,同期把 web 带到今日的岗位。Web 标准已经被超越53%浏览器创立商选取并真正地重申,jQuery 是个中的来由之一。jQuery 基金会的义务是“通过开源软件的支出和支撑,以及开荒社区的搭档,革新开放的 web,让每一人都可以访谈它。”

jQuery 是世界上最常用的 JavaScript 库,全体应用程序都应该利用它,除非你不在意程序猿的工作功能。它使得 DOM 遍历、事件管理、动画、AJAX 在具有浏览器上变得更简单、更易于。

几时使用 jQuery?直白选用,除非您想利用三个像 Zepto 的轻量级版本。

GitHub: 
时下版本: v1.11.3 or v2.1.4
网站: jquery.com

  AngularJS

Underscore &lodash

不常 JavaScript 内置的效应产生工程师的效用并不高。总是缺乏贰个工具函数或一个能够简化代码的函数。Underscore(和 lodash)是三个 JavaScript 库,它提供了一站式工具函数,无需对停放 JavaScript 对象打补丁。三个库均提供超越 100 个作用帮手和别的语专科高校用功效,包含 map,filter,invoke,reduce,template, throttle, bind, extend, pick, clone 等更加多的函数。

几时使用 Underscore?当您须要三个独立的 JavaScript 文件,来即刻提高技术员的工效时。

Underscore GitHub: 
Underscore 当前版本: 1.8.3
Underscore 网站: underscorejs.org

曾几何时使用 lodash?当你必要模块化和性质稍强版本的 Underscore,同期更易于地支持 AMD 和社区插件时。

LodashGitHub: 

Lodash 当前版本: v3.10.1

Lodash 网站: lodash.com

  Angular 是一款流行的商家级 框架,比较多程序猿都用它来创设和维护复杂的网页应用。Angular 具备贤人气,使用它的市廛跟 Domino 的 Pizza 类别雷同多,如 Ryanair, iTunes Connect, PayPal Checkout, 谷歌。Angular 是多个由 Google协理的开源框架。Angular 称自身为创设复杂网页应用而对 HTML 的扩展。如若你也对 TypeScript 很精通,那么能够看看 如何写 Angular 2 .

D3.js

数据可视化和图片是一种布满的 web 应用程序要求。D3.js 是任何数据操作和可视化的事实标准。它是 GitHub上最受招待的项目之一,被大量的公司利用。大量的图纸,图表和可视化库在 D3 上创设。

D3 允许你操作任何来自的多寡文书档案,转变来 DOM 或/和 SVG 或/和 CSS。D3 关切今世 web 标准,确认保证您不受任何专有格式的自律,举个例子 Flash 和 Silverlight。

哪一天使用 D3.js?在您需求任何款式的可视化的时候。

GitHub: 
当下版本: 3.5.6
网站: d3js.org

  Angular 选用 MVC 架构。它提供了 Model 层和 View 层之间双重数据绑定。这种多少绑定格局的益处是随意什么数据变动,都会自行的换代两侧的数码。那有助于你构建可吞食的 View 组件。它还提供了二个上下端服务易于交互的劳务框架。最根本的是,它是简单的 JavaScript。

Babylon.js

想要营造完全符合今世 web 标准且跨浏览器的摄像游戏吗?看看 Babylon.js,它是依靠 WebGL 和 JavaScript 的 3d 游戏引擎。你能够创造令人可疑的包涵物理、音频和粒子系统等等的高水平游戏。

几时使用 Babylon.js?任凭哪天,只要您想做三个录制游戏或其它类型的眼花缭乱三个维度场景,都能用上。

GitHub: 
此时此刻版本: 2.2
网站: babylonjs.com

  什么日期使用 AngularJS? 当你构建一个复杂的网页前端选取并索要一个单独的模块框架去管理整个时。

Three.js

想要创设二个 3D 可视化场景,但无需二个总体的15日游引擎?three.js 提供了一个轻量级的 3d 库,允许渲染 3d 为 HTML5 画布、SVG 和 WebGL。它是一定轻便的库,在 three.js 的显得里有数百个绝色的例证。

曾几何时使用Three.js?当你须求一个能出口为 Canvas 的大致的 3D 可视化场景时。

GitHub: 
当下版本: r73
网站: threejs.org

  GitHub:

Mocha& Chai

JavaScript 在不短一段时间内是老大讨厌的。测量检验任何代码常常都被以为是讨厌的,但它却是每个开拓人士都应有做的工作。每一种开拓人士仿佛总是不屑一顾和大体它,而不测量试验他们的代码。那个该死的东西有一个化解办法,那正是Mocha 和 Chai。七个库的名字都来源于美味的热果汁,它们都能帮您测量检验代码,但方法各异。 

Mocha 是一个 JavaScript 测验框架,使得你在 node 模块和浏览器 app 中测量检验异步代码变得更易于。Mocha 测量试验能够串联运营,可感到精确的测量检验用例加多极度追踪的工夫。

Chai 是一个行事使得开拓/测验驱动开拓的断言库,能够搭配 Mocha 使用。它能够把你需求测量检验的事物用可读的风骨简单地球表面明出来。

曾几何时使用 Mocha & Chai?连天!请测量试验你的代码,让世界变得更加雅观好。

Mocha 当前版本: 2.3.3
Mocha 网址: mochajs.org
Chai GitHub: 
Chai 当前版本: v3.4.1
Chai 网址: chaijs.com

  Current Version:1.4.7/1.2.29

Karma

既是已经把 Mocha 和 Chai 满含在那些列表中了,假设不带有用来运营这一个测量试验或设置持续集成测量试验的测验运维器,那将是不完整的。Karma 是一款目的在于救助您在分裂的浏览器上电动运转测量检验的工具。它可以扶持您在装有浏览器上运维Mocha 和 Chai 测量检验。

不是种种浏览器都运转在富有平台,但万幸的是足以选用部分无需付费工具来测验其余浏览器,看看 Browser Screenshots。如若您正在 OS X 上运维代码,想测验 Edge 或 IE,能够 免费 使用那几个工具。

几时使用 Karma?当您的应用程序有二个宏观的测量试验套件,并希望确定保障测量检验在具备浏览器上经过时。

GitHub: 
当前版本: v0.13
网址: karma-runner.github.io

  Website: angularjs.org

PhantomJS

运维总体的浏览器来测验你的代码对比耗内部存款和储蓄器和 CPU。PhantomJS 允许你运转多少个轻量的 WebKit —— Safari 和Chrome(未来是 Blink)后台的渲染引擎。它同意你通过 JavaScript API 运转测验,捕捉截图,监察和控制网络和机动浏览页面。

哪一天使用 PhantomJS ?当您须要开展越来越多的测量检验,操作页面和监视网络哀告时。

GitHub: 
日前版本: v2.0
网址: phantomjs.org

  二:React 是15年最受接待的 JavaScript 项目!大约人人都在商酌ReactJS。二〇一八年,小编加入的每贰个会差相当的少都会有一五个话题斟酌 React 和一样体系下的别的库( Flux , Redux ) 。React 是四个开源项目,大概是由 Fackbook 和任何首要的手艺公司进献开拓的。React 称自身为为塑造客商接口而提供的 JavaScript 库。

Grunt & Gulp

为生育情形塑造网址,平日涉及到加强质量的天职,比方 JavaScript 和 CSS 的压缩, CoffeeScript/TypeScript 的编写翻译,单元测量检验,语法检查。只怕你早已有三个为网址公布到生产意况的工具链,若无,你能够应用任务运维器,例如Grunt 或Gulp。两者都有雅量关于网址的别的调换的插件,为通知到生产条件做好企图。

何时使用 Grunt?当您爱怜写配置文件同不时候不介意你的职分局维器生成人中学间文件时。

Grunt GitHub: 
Grunt 当前版本: v0.4.5
Grunt 网址: gruntjs.com

几时使用 Gulp?当您爱怜在配置上写代码和利用 node.js 的流效用来加快任务实践时。

Gulp GitHub: 
居尔p 当前版本: v3.9.0
Gulp 网址: gulpjs.com

  React 基本上用来作为 MVC 中的 V。它完全潜心于 MVC 中的 V 部分,而忽视了动用中的别的一些架构。它提供了三个组件层,那让大家易于制作UI成分并将那么些UI成分组合在一道。它抽象出了DOM,因而而优化了渲染, 并允许你选用 node.js 渲染 React。别的,它达成了单向数据交互流,那使它比任何的框架更便于通晓和应用。

Babel

JavaScript 语言正在飞快发展。ECMAScript2016于二〇一八年夏天发布,它的成都百货上千新特点在风靡的浏览器上完结了。若是您想看看 ECMAScript 2014 的包容性,你可以看看来自 @kangax 的那一个 表。你会注意到,最新版本的 Edge,Firefox 和 Chrome 已经差不离全盘相配了。

作者们实际不是活着在三个宏观的社会风气。作为开荒职员,大家须求继续协助旧的浏览器,它们从不流行最棒的 JavaScript 个性。大家要拉动 web 和校正我们的代码库。Babel 是三个JavaScript 编写翻译器,用于把最新的 JavaScript 规范编写翻译成可在 IE9 等老浏览器上运转的包容ES5的 JavaScript。它有一对插件,使得 React 开辟更便于,乃至可以动用部分不属于该标准的表征(举个例子ES7)。

何时使用 Babel?当你想行使新的 JavaScript 语言特征,相同的时间还要支撑老版本浏览器时。

GitHub: 
现阶段版本: 6.1.2
网址: babeljs.io

  七个类型举个例子 Angular ,Ember 绑定使用 React 成为 MVC 中的 V。

愈来愈多 Web 开采实行

正文来源微软技能布道师 Web 开拓体系,里面有实用的 JavaScript 学习,开源项目和互操作性的极品执行(饱含与 微软Edge 浏览器和新的 EdgeHTML渲染引擎)。

小编们鼓劲你跨浏览器和器械开展测量试验,包罗微软的Edge——Windows 10的私下认可浏览器——在 dev.modern.IE 上有免费工具:

  • 举目四望你的网址中过时的库,布局难点和可访问性
  • 下载 Mac, Linux 和 Windows 下的无偿设想机
  • 跨浏览器检查 Web 平台状态,包蕴微软 Edge 的路径图
  • 在您的配备上长途测量试验微软 Edge

起点大家程序员和布道者的更长远学习:

  • GitHub 上的编码实验室: 跨浏览器测验和最好施行
  • 2015 微软 Edge Web 峰会 (来自大家的技术员团队和JS社区)
  • 很棒,小编得以在 Mac 和 Linux 上测验 Edge 和 IE 了! (来自Rey Bango)
  • 推动 JavaScript 同临时间不损坏 Web (来自Christian Heilmann)
  • Edge 渲染引擎让 Web 职业 (来自Jacob Rossi)
  • 基于 WebGL 的 3D 渲染 (来自David Catuhe)
  • 托管 web app 和 web 平台的改进 (来自Kevin Hill和Kiril Seksenov)

笔者们的社区开源项目:

  • vorlon.JS (跨设备远程 JavaScript 测验)
  • manifoldJS (铺排跨平台托管 web app)
  • babylonJS (让 3D 图形制作更简便易行)

越多无需付费工具和后端web开辟内容:

  • Linux, MacOS 和 Windows 下的 Visual Studio Code
  • 使用 node.JS 编码并在 Azure 上免费试用

    2 赞 26 收藏 1 评论

  哪天使用 React?当你想要有贰个强硬的 View 层,而选取中的其余一些缺无需贰个繁杂的框架时,或当你想要贰个 View 层和您的 Angular, Backbone,可能Ember应用一同使用。当你试着营造五个同构的网页框架。

关于小编:cucr

图片 1

搜狐新浪:@hop_ping 个人主页 · 作者的稿子 · 17

图片 2

  GitHub:

  近期版本: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 在 UENVISIONL 管理和状态管理方面做的很好。对于开垦一个单页面应用,全数供给的作用都得以帮忙,没有要求相当引进不需求的复杂性。

  什么日期使用 Backbone?对于Mini的 web 程序,Backbone 是自己必选的框架。

  GitHub:

  当前版本: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:

  当前版本:2.1.0

  官方网站: emberjs.com

  JQuery 那一个库就无须多做牵线了。它独自承担了让跨浏览器网址成为切实的沉重,是它使得全数web 成为后天这一个样子。Web 标准的制订以及浏览器厂商对正规的承受地点,jQuery 功不可没。jQuery 基金会的对象是"通过开源软件的开垦和支撑,以及社区的协作,增长开放的网络,让每一个人都能访问"

  JQuery 是世界上采用最广的 JavaScript 库,未有选取能够相差它,除非你对开垦效能不感兴趣。它使得 DOM 遍历、事件管理、动画和 AJAX 在富有浏览器上都变得如此的简短易用。

  哪一天使用 jQuery?任曾几何时候,除非你谋算动用更轻量级的本子,比方 Zepto 。

  GitHub:

  当前版本: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 :

  Underscore 当前版本:1.8.3

  Underscore 网站: underscorejs.org

  哪天利用 lodash?当您想要一个模块化的,品质更理想一点的,并附带有对于 英特尔和社区插件协理的 Underscore 版本时。

  Lodash GitHub:

  Lodash 当前的本子:v3.10.1

  Lodash 网站: lodash.com

  D3.js

  数据可视化和图片是web应用程序的一种健康供给。当提到到别的数据操作和可视化时,D3.js 正是实际上的正规。它是 GitHub 上最受迎接的体系之一,并被数百个集体机关所采取。大批量的图形、Logo和可视化库都是构件于 D3 之上的。

  D3 让您可以操作任何来自的多少文书档案,并将数据进行退换后使用到 DOM、SVG 和 CSS上。D3 潜心于今世的 web 标准,以及保证您能够不受到其余像 Flash 大概 Silverlight 那样的专有格式的范围。

  什么日期利用 D3.js?当您供给任何类型的视觉效果的时候。

  GitHub:

  当前版本:3.5.6

  网站: d3js.org

   Babylon.js

  想要创设一个一心运营于当代浏览器上,况且能跨浏览器运维的录像游戏吧?那就看看 Babylon.js 吧,它是三个 3D 游戏引擎,基于 WebGL 和 JavaScript。你能够动用其概况、音频和粒子系统创立出超过预期的高素质游戏来。

  何时利用 Babylon.js?当您正在营造二个摄像游戏只怕贰个某体系型的 3D 场景时。

  GitHub:

  当前版本: 2.2

  网站: babylonjs.com

  Three.js

  想要营造三个 3D 视觉特效,可是又无需一个意义一体化的嬉戏?Three.js 提供了八个轻量级的 3D 库,让你能够将 3D 效果渲染成三个 HTML5 的 canvas, SVG, 和 WebGL。那是贰个详单轻松的库,在 three.js 陈列站点上能够观望数百个完美的身体力行。

  几时利用 Three.js?当您供给一个简短的能出口为 Canvas 的 3D 视觉效果时。

本文由威尼斯国际官方网站发布于奥门威尼斯网址,转载请注明出处:库和工具,前端框架

关键词: