前端热门JavaScript 框架和库

作者:日期:2017-02-27 23:24:25 点击:272

前端热门JavaScript 框架和库

JavaScript 框架和库可以说是开源项目中最庞大也是最累的类目了,目前在github 上这一类的项目是最多的,并且几乎每隔一段时间就会出现一个新的项目席卷网络社区,虽然这样推动了创新的发展,但不得不说苦了前端的开发者们。 
这篇文章主要描述现今流行的一些 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‘>https://github.com/angular/angular.js

Current Version: 1.4.7/1.2.29

Website: angularjs.org

React

React 是今年最受欢迎的 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/

Ember

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

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

上一篇: jQuery中的ready和load事件

下一篇: ECMAScript 2015 (ES6) 概览