JavaScript 即未来:介绍 14 个 JavaScript 的框架和库

Javascript 得到了众多的技术领导者的拥护和支持,其中一位就是 WordPress 的作者 Matt Mullenweg , 他表示 WordPress 开发者 应该学习 JavaScript , 这也清晰地向 WordPress 社区传达了 JavaScript 在未来的重要性。 同时,这一观点也被普遍接受。向着更先进的技术靠拢与过渡也同时保证了 WordPress 在未来的挑战中不会落于人后。

JavaScript 同时也是众多站在开源立场的技术中的佼佼者。与现在所流行的观点相反,JavaScript 不是一个工程,而是一个由其核心团队共同制定和维护的开放标准。ECMAScript , 这是另一个和 JavaScript 相关的名字, 它虽然不是开源的,但它也有一个开放的标准。

当你在浏览 GitHub 的时候你就可以发现 JavaScript 在当今有多么流行了。而且就仓库的数量 而言,JavaScript 绝对位于所有的编程语言当中最顶尖的那一层次。 同时,在 Livecoding.tv 上你也能看出 JavaScript 有多么突出,这里的用户发布的关于 JavaScript 的视频的数量比其他的话题多得多。在写这篇文章的时候(2016 年底),Livecoding.tv 上已经有 45,919 个 用户原创的 JavaScript 视频教程 。

热门的开源 JavaScript 框架和库

回归到主题, 庞大的社区是 JavaScript 的一个得天独厚的优势,同时这也推动了 JavaScript 的蓬勃发展。这里有数以百千计的成熟的 JavaScript 框架和库供开发者使用,同时这些最优秀的框架和库都是开源的。对当前的 JavaScript 开发者来说,能够使用这些优秀的框架和库来进行快速开发已经是必须技能了。当今的市场需要快速开发,但是,重复造轮子是没有必要的。不论你是一个 JavaScript 新手还是一个资深的 JavaScript 开发者,使用框架和库都能极大提高你的工作效率。

好了,让我们开始吧!

1. Angular.js

Angular.js 是目前最热门的 JavaScript 框架之一。它用于开发者构建复杂的 web 应用。Angular.js 背后的思想是它的单页应用 model。同时它 也支持 MVC 架构。在 Angular.js 中 ,开发者可以在前端中使用 JavaScript 代码,并从字面上扩展 HTML 词汇。

Angular.js 自 2009 年出现以来已经有了很大的改进。Angular 1 当前的稳定版本是 1.5.8/1.2.30 。你也可以试一试 Angular 2 ,相对于 Angular 1 来说它有了重大的改进,但这个新版本仍未在全球范围内被普遍使用。

在 Angular.js 中,数据绑定是完成工作的一个重要概念。在用户与接口的交互中,当交互完成,view 就会自动更新,随即新值与 model 交互以确保一切都是同步的。底层的逻辑在 model 中执行完成后,DOM 也会随即更新。

2. Backbone.js

复杂 web 应用并不适用于所有场景。一些较简单的 web 应用框架例如 Backbone.js 就非常适合学习 web app 开发。Backbone.js 是一个简单的框架,可以快速方便地构建简单的 web 应用。和 Angular.js 一样,Backbone.js 也支持 MVC 。Backbone.js 还有一些其它关键特性如路由,RESTful API 支持,适当的状态管理等等。你甚至还可以用 Backbone.js 来构建单页应用。

当前的稳定版本是 1.3.3,可以在 GitHub 中找到。

3. D3.js

D3.js 是一个优秀的 JavaScript 库,它允许开发者创建具有数据处理功能的富 web 页面。D3.js 使用 SVG、HTML 和 CSS 来实现这一切功能。使用 D3.js ,你可以更轻松地将数据绑定到 DOM 及启用数据驱动事件。使用 D3.js ,你还可以创建高质量的数据驱动的 web 页面来提供一个更易于理解的视觉效果来呈现数据。查看示例 : LCF 符号哈密顿图 ,由 D3.js 强力驱动。

4. React.js

React.js 是一个使用起来很有趣的 JavaScript 框架。和其它的 JavaScript 框架不同,React.js 志在构建一个高可扩展的前端用户界面。React.js 出现于 2013 年,它采用了 BSD 开源协议。它因其能够开发复杂且漂亮的用户界面所带来的优势而迅速发展壮大。

React.js 背后的核心思想是虚拟 DOM 。虚拟 DOM 在客户端和服务端之间扮演着一个中间人的角色并带来了显著的性能提升。虚拟 DOM 的改变和服务器端 DOM 一样,只需要更新所需的元素,相对于传统的 UI 渲染来说极大提升了渲染速度。

你还可以使用 Recat 来实现 meterial 风格的设计,使你能够开发具有无与伦比的性能的 web 应用。

5. jQuery

jQuery 是一个非常流行的 JavaScript 库,它拥有众多特性例如事件处理、动画等。当你在做一个 web 项目的时候,你不会想要把时间浪费在为一些简单的功能写代码上。jQuery 为减少你的工作量提供了一些易于使用的 API 。这些 API 在所有的常见的浏览器中都能够使用。使用 jQuery, 你可以无缝地控制 DOM 以及 Ajax 这样在近几年来拥有大量需求的任务。使用 jQuery,开发者不必担心一些低级的交互,同时可以使他们的 web 应用的开发更加容易与迅速。

jQuery 同时便于分离 HTML 和 JavaScript 代码,使开发者能够编写简洁而跨浏览器兼容的代码。并且使用 jQuery 创建的 web 应用在将来也易于改善和扩展。

6. Ember.js

Ember.js 是一个 Angular.js 和 React.js 的功能混合体。当你在浏览社区的时候你能明显地感受到 Ember.js 的热门程度。Ember.js 的新特性也不断地在添加。它在数据同步方面与 Angular.js 很像。 双向的数据交换可以确保应用的快速性和可扩展性。同时,它还能够帮助开发者创建一些前端元素。

和 React.js 的相似之处在于,Ember.js 提供了同样的服务器端虚拟 DOM 以确保高性能和高可扩展。同时, Ember.js 提倡简化代码,提供了丰富的 API。Ember.js 还有非常优秀的社区。

7. Polymer.js

如果你曾想过创建你自己的 HTML5 元素,那么你可以使用 Polymer.js 来做这些事。 Polymer 主要集中于通过给 web 开发者提供创建自己的标签的功能来提供扩展功能。例如,你可以创建一个和 HTML5 中的 <video> 类似的具有自己的功能的 <my_video> 元素。

Polymer 在 2013 年被 Google 引入并以 三句版 BSD 协议发布。

8. Three.js

Three.js 又是另一个 JavaScript 库,主要用于 3D 效果开发。如果你在做游戏开发的动画效果,那么你可以利用 Three.js 的优势。Three.js 在底层中使用 WebGL 使 Three.js 可以轻松地被用于在屏幕上渲染 3D 物体。举一个比较知名的使用 Three.js 的例子就是 HexGLA,这是一个未来派赛车游戏。

9. PhantomJS

使用 JavaScript 工作就意味着和不同的浏览器打交道,同时,当提及浏览器的时候,就不得不讨论资源管理。在 PhantomJS 中,由于有 Headless WebKit 的支持,所以你可以随时监测你的 web 应用。Headless WebKit 是 Chrome 和 Safari 使用的渲染引擎中的一部分。

这整个过程是自动化的,你所需要做的只是使用这个 API 来构建你的 web 应用。

10. BabylonJS

BabylonJS 与 Three.js 不相伯仲, 提供了创建平滑而强大的 3D web 应用的 JavaScript API。它是开源的,且基于 JavaScript 和 WebGL 。创建一个简单的 3D 物体,比如一个球体是非常简单的,你只需要写短短几行代码。通过这个库提供的 文档,你可以很好地掌握它的内容。 同时 BabylonJS 的主页上也提供了一些优秀的 demo 来当作参考。在其官网上你可以找到这些 Demo。

11. Boba.js

Web 应用总是有一个共通的需求,那就是分析。如果你还在苦于将数据的分析与统计插入到 JavaScript 的 web 应用中,那么你可以试一下 Boba.js。Boba.js 可以帮助你将分析的数据插入到你的 web 应用中并且支持旧的 ga.js 。你甚至可以把数据指标和 Boba.js 集成在一起,只需要依赖 jQuery 即可。

12. Underscore.js

Underscore.js 解决了 “当我面对一个空白 HTML 页面并希望即刻开始工作,我需要什么” 这个问题。当你刚开始一个项目,你可能会感到失落或者重复一系列你在之前项目中常做的步骤。 为了简化开启一个项目的过程和给你起个头,Underscore.js 这个 JavaScript 库给你提供了一系列的方法。例如,你可以使用你在之前项目中常用的 Backbone.js 中的 suspender 或者 jQuery 的一些方法。

一些实用的帮助例如 “filter” 和 “invoke the map” 可以给你起个好头,以助于你尽可能快的投入到工作中。 Underscore.js 同时还自带了一个套件来简化你的测试工作。

13. Meteor.js

Meteor.js 是一个快速构建 JavaScript 应用的框架。它是开源的且它能够用于构建桌面应用、移动应用和 web 应用。Meteor.js 是一个全栈的框架同时允许多平台的端到端开发。 你可以使用 Meteor.js 来实现前端和后端功能,同时它也能密切监视应用的性能。Meteor.js 的社区非常庞大,所以它会有不断的新特性更新或者是 bug 修复。Meteor.js 也是模块化的,同时它能配合一些其它的优秀的 API 使用。

14. Knockout.js

Knockout.js 在这些库中可能是最被低估的一个。它是一个基于 MIT 开源协议的开源 JavaScript 框架。作者是Steve Sanderson。它基于 MVVM 模式。

值得注意的是: Node.js

Node.js 是一个强有力的 JavaScript 运行时环境。它可以被用于使用真实世界数据来构建快速且可扩展的应用。它既不是一个框架也不是一个库,而是一个基于 Google Chrome 的 V8 引擎的运行时环境。你可以用 Node.js 来创建多元化的 JavaScript 应用,包括单页应用、即时 web 应用等等。从技术层面上来讲,由于它的事件驱动式架构,所以 Node.js 支持异步 I/O 。这种做法使得它成为开发高可扩展应用的一个极好的解决方案的选择。查看 Node.js在 livecoding.tv 上的视频。

总结

JavaScript 是 web 开发中的通用语言。它之所以快速发展不仅仅是因为它所提供的内容,更多的是因为它的庞大的开源社区的支持。以上提到的框架和库对任何一个 JavaScript 开发者来说都是必须知道的。它们都提供了一些途径来探索 JavaScript 和前端开发。上面提及的大部分框架和库频繁地在 Livecoding.tv 上出现,其大部分来自对 JavaScript 及其相关技术感兴趣的软件工程师。

原文发布时间为:2017-04-07

时间: 2024-11-27 11:42:25

JavaScript 即未来:介绍 14 个 JavaScript 的框架和库的相关文章

JavaScript即未来:介绍14个JavaScript的框架和库

JavaScript 即未来趋势所在. Javascript 得到了众多的技术领导者的拥护和支持,其中一位就是 WordPress 的作者 Matt Mullenweg , 他表示 WordPress 开发者 应该学习 JavaScript , 这也清晰地向 WordPress 社区传达了 JavaScript 在未来的重要性. 同时,这一观点也被普遍接受.向着更先进的技术靠拢与过渡也同时保证了 WordPress 在未来的挑战中不会落于人后. JavaScript 同时也是众多站在开源立场的技

JavaScript内存管理介绍

 这篇文章主要介绍了JavaScript内存管理介绍,本文讲解了内存生命周期.JavaScript的内存分配.通过函数调用的内存分配.当内存不再需要使用时释放等内容,需要的朋友可以参考下     简介 低级语言,比如C,有低级的内存管理基元,想malloc(),free().另一方面,JavaScript的内存基元在变量(对象,字符串等等)创建时分配,然后在他们不再被使用时"自动"释放.后者被称为垃圾回收.这个"自动"是混淆并给JavaScript(和其他高级语言)

javaScript基础语法介绍

本文从javascript简介开始,介绍了javascript的语法以及注意事项.动态语言.引用外部JS文件.变量命名规则.判断是否已经声明.不存在块级作用域这些方面的内容,是篇相当不错的基础语法的介绍文章,推荐给小伙伴们 简介 JavaScript是一种脚本语言. (脚本,一条条的文字命令.执行时由系统的一个解释器,将其一条条的翻译成机器可识别的指令,然后执行.常见的脚本:批处理脚本.T-SQL脚本.VBScript等.) HTML只是描述网页长相的标记语言,没有计算.判断能力,如果所有计算.

常用的JavaScript模板引擎介绍

这篇文章主要介绍了常用的JavaScript模板引擎介绍,本文介绍了8款常用JavaScript 模板引擎,着重讲解了artTemplate模板引擎,需要的朋友可以参考下     最近工作内容慢慢接近我的理想化(web前端),所以关注比较多的是前端性能!后台同事介绍使用ajax模板引擎,提高渲染速度! 下面介绍几款 JavaScript 模板引擎 1. Mustache 基于javascript 实现的模板引擎,类似于 Microsoft's jQuery template plugin,但更简

常用的JavaScript模板引擎介绍_javascript技巧

最近工作内容慢慢接近我的理想化(web前端),所以关注比较多的是前端性能!后台同事介绍使用ajax模板引擎,提高渲染速度! 下面介绍几款 JavaScript 模板引擎 1. Mustache 基于javascript 实现的模板引擎,类似于 Microsoft's jQuery template plugin,但更简单易用! 2. doT.js doT.js 包含为浏览器和Node.js 准备的 JavaScript 模板引擎. 3. jSmart jSmart 是著名的 PHP 模板引擎 S

javaScript基础语法介绍_基础知识

简介 JavaScript是一种脚本语言. (脚本,一条条的文字命令.执行时由系统的一个解释器,将其一条条的翻译成机器可识别的指令,然后执行.常见的脚本:批处理脚本.T-SQL脚本.VBScript等.) HTML只是描述网页长相的标记语言,没有计算.判断能力,如果所有计算.判断(比如判断文本框是否为空.判断两次密码是否输入一致)都放到服务器端执行的话网页的话页面会非常慢.用起来也很难用,对服务器的压力也很大,因此要求能在浏览器中执行一些简单的运算.判断.JavaScript就是一种在浏览器端执

javascript的闭包介绍(司徒正美)_javascript技巧

闭包的定义非常晦涩--闭包,是指语法域位于某个特定的区域,具有持续参照(读写)位于该区域内自身范围之外的执行域上的非持久型变量值能力的段落.这些外部执行域的非持久型变量神奇地保留它们在闭包最初定义(或创建)时的值(深连结).简单来说,闭包就是在另一个作用域中保存了一份它从上一级函数或作用域取得的变量(键值对),而这些键值对是不会随上一级函数的执行完成而销毁.周爱民说得更清楚,闭包就是"属性表",闭包就是一个数据块,闭包就是一个存放着"Name=Value"的对照表.

JavaScript prototype 使用介绍_javascript技巧

用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱. 每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法和属性,也就是说将函数用作构造函数调用(使用new操作符调用)的时候,新创建的对象会从原型对象上继承属性和

新手教程:您必须了解的15套JavaScript框架与库

[51CTO.com快译]JavaScript拥有着庞大的技术社区,而如此可观的技术支持基础亦帮助其进一步在受众群体中吸引人气.值得强调的是,目前面向开发者的大部分框架及库属于开源项目,这意味着相关开发人员能够轻松运用这些资源以高效完成日常工作.因此,无论您身为JavaScript新手抑或经验丰富的前辈高人,充分利用这些方案的既有优势都将显著提升您的开发效率与效果. 在今天的文章中,我们将介绍15款最为重要的JavaScript框架与库--您千万不要错过. 1. Angular.js Angul