Total Pageviews

Sunday, 17 July 2016

JavaScript资源大全中文版

JavaScript 资源大全中文版,内容包括:包管理器、加载器、测试框架、运行器、QA、MVC框架和库、模板引擎等.
我想很多程序员应该记得 GitHub 上有一个 Awesome - XXX 系列的资源整理。awesome-javascript 是 sorrycc 发起维护的 JS 资源列表,内容包括:包管理器、加载器、测试框架、运行器、QA、MVC框架和库、模板引擎、数据可视化、时间轴、编辑器等等
Awesome 系列虽然挺全,但基本只对收录的资源做了极为简要的介绍,如果有更详细的中文介绍,对相应开发者的帮助会更大。这也是我们发起这个开源项目的初衷。

我们要做什么?


如何参与本项目?

从下面的目录来看,本项目的工作量小不了,所以非常期待能有更多程序员一起来参与。
不过加入前,有几个小要求:
  • 英文还不错,能读懂英文并用自己的话复述;
  • 在用 JavaScript;
如有兴趣,请加 QQ:50872495。加 Q 时请注明「JS大全」

如何为列表贡献新资源?

欢迎大家为列表贡献高质量的新资源,提交PR时请参照以下要求:
  • 请确保推荐的资源自己使用过
  • 提交PR时请注明推荐理由
资源列表管理收到PR请求后,会定期(每周)在微博转发本周提交的PR列表,并在微博上面听取使用过这些资源的意见。确认通过后,会加入资源大全。
感谢您的贡献!

本项目的参与者

注:名单不分排名,不定期补充更新

奖励计划

虽然奖励可能并不是你加入的主要原因,但还是有必要提一下:
  • 整理超过 20 个资源后,可在伯乐在线上开通打赏;
  • 每整理 20 个资源,有机会获得技术书籍或各种有意思的创意、极客产品;
  • 奖励详情

目录


包管理器

管理着 javascript 库,并提供读取和打包它们的工具。
  • npm:npm 是 javascript 的包管理器。官网
  • Bower:一个 web 应用的包管理器。官网
  • component:能构建更好 web 应用的客户端包管理器。官网
  • spm:全新的静态包管理器。官网
  • jam:一个专注于浏览器端和兼容 RequireJS 的包管理器。官网
  • jspm:流畅的浏览器包管理器。官网
  • Ender:没有库文件的程序库。官网
  • volo:以项目模板、添加依赖项与自动化生成的方式创建前端项目。官网 
  • Duo:一个整合 Component、Browserify 和 Go 官网的最佳思想,使开发者能快速方便地组织和编写前端代码的下一代包管理器。

加载器

JavaScript 的模块或加载系统。
  • RequireJS:JavaScript 文件和模块的加载器。官网
  • browserify:在浏览器端以 node.js 的方式 require()。官网
  • SeaJS:用于 Web 的模块加载器。官网
  • HeadJS:HEAD 的唯一脚本。官网
  • curl:小巧、快速且易扩展的模块加载器,它能处理 AMD、CommonJS Modules/1.1、CSS、HTML/text 和历史脚本。官网
  • lazyload:小巧且无依赖的异步 JavaScript 和 CSS 加载器。官网
  • script.js:异步 JavaScript 加载器和依赖管理器。官网
  • systemjs:AMD、CJS(commonJS) 和符合 ES6 规范的模块加载器。官网
  • LodJS:基于 AMD 的模块加载器。官网
  • ESL:浏览器端的模块加载器,支持延迟定义和 AMD。官网
  • modulejs:轻量的 JavaScript 模块系统。官网

打包工具

  • browserify :Browserify 让你能在浏览器端使用 require('modules') ,打包所有依赖。官网
  • webpack:为浏览器打包 CommonJs/AMD 模块。官网

测试框架

框架

  • mocha:适用于 node.js 和浏览器、简易、灵活、有趣的 JavaScript 测试框架。官网
  • jasmine:简单无 DOM 的 JavaScript 测试框架。官网
  • qunit:一个易于使用的 JavaScript 单元测试框架。官网
  • jest:简单的 JavaScript 单元测试框架。官网
  • prova:基于 Tape 和 Browserify 的测试运行器,它适用于 Node & 浏览器。官网
  • DalekJS:自动化且跨浏览器的 JavaScript 功能测试框架。官网

断言

  • chai:适用于 node.js 和浏览器的 BDD / TDD 断言框架,并能搭配其它测试框架使用。官网
  • Sinon.JS:对 JavaScript 进行 spies、stubs 和 mock 测试。官网
  • expect.js:简约的、适用于 Node.js 和浏览器端的 BDD 式断言工具。官网
  • should.js:适用于 Node.js 的 BDD 式断言工具。官网

覆盖率

  • istanbul:另一个 JS 代码覆盖率检测工具。官网
  • blanket:一个简单的代码覆盖率检测库。它的设计理念是易于安装和使用,且可用于浏览器端和 node.js。官网
  • JSCover:JSCover 是一个检测 JavaScript 程序代码覆盖率的工具。官网

运行器

  • phantomjs:脚本化的 Headless WebKit。官网
  • slimerjs:一个内核为 Gecko 的类似 PhantomJS 工具。官网
  • casperjs:基于 PhantomJS 和 Slimer JS 的导航脚本和测试工具。官网 
  • zombie:基于 node.js 、快速、全栈且无图形界面的浏览器的测试工具。官网
  • totoro:一个简单可靠且能跨浏览器运行的测试工具。官网
  • karma:一个优秀的的 JavaScript 测试运行器。官网
  • nightwatch:基于 node.js 和 selenium webdriver 的图形界面自动化测试框架。官网
  • intern:下一代 JavaScript 代码测试栈。官网
  • yolpo:在浏览器逐句执行的 JavaScript 解释器。官网

QA 工具

  • JSHint:JSHint 是一个有助于发现 JavaScript 代码错误和潜在问题的工具。官网
  • jscs:JavaScript 代码风格检测工具。官网
  • jsfmt:格式化、搜索和改写 JavaScript。官网
  • jsinspect:检测复制粘贴和结构类似的代码。官网
  • buddy.js:发现 JavaScript 代码里的 魔术数字官网
  • ESLint:完全插件化的工具,能在 JavaScript 中识别和记录模式。官网
  • JSLint :高标准、严格和固执的代码质量工具,旨在只保持语言的优良部分。官网

MVC 框架和库

  • angular.js:为网络应用增强 HTML。官网
  • aurelia:一个适用于移动设备、桌面电脑和 web 的客户端 JavaScript 框架。官网
  • backbone:给你的 JS 应用加入带有 Models、Views、Collections 和 Events 的 Backbone。官网
  • batman.js:最适合 Rails 开发者的 JavaScript 框架。官网
  • ember.js:一个旨在创建非凡 web 应用的 JavaScript 框架。官网
  • meteor:一个超简单的、数据库无处不在的、只传输数据的纯 JavaScript web 框架。官网
  • ractive:新一代 DOM 操作。官网
  • vue:一个用于构建可交互界面的、直观快速和可组合的 MVVM 框架。官网 
  • knockout:Knockout 用 JavaScript 让创建响应式的富 UI 更加容易。官网 
  • spine:构建 JavaScript 应用的轻量 MVC 库。官网
  • espresso.js:一个极小的、用于制作用户界面的 JavaScript 库。官网
  • canjs:让 JS 更好、更快、更简单。官网
  • react:用于建构用户界面的库。它是声明式的、高效的和极度灵活的,并使用虚拟 DOM 作为其不同的实现。官网
  • react-native:一个用 React 构建原生应用的框架。官网
  • riot:类 React 库,但很轻量。官网
  • thorax:加强你的 Backbone。官网
  • chaplin:使用 Backbone.js 库的 JavaScript 应用架构。官网
  • marionette:一个 Backbone.js 的复合应用程序库,旨在简化大型 JavaScript 应用结构。官网
  • ripple:一个小巧的、用于构建响应界面的基础框架。官网
  • rivets:轻量却拥有强大的数据绑定和模板解决方案官网
  • derby:让编写实时和协同应用更简单的 MVC 框架,能够在 Node.js 和浏览器同时运行。官网
    • derby-awesome:很棒的 derby 组件集合。官网
  • way.js:简单、轻量、持久化的双向数据绑定。官网
  • mithril.js:Mithril 是一个客户端 MVC 框架(轻量、强大和快速)官网
  • jsblocks:jsblocks 是一个更好的 MV-ish 框架。官网
  • LiquidLava:易懂的、用于构建用户界面的 MVC 框架。官网

基于 Node 的 CMS 框架

  • KeystoneJS:强大的 CMS 和 web 应用框架。官网
  • Reaction Commerce:拥有实时的架构和设计的响应式(reactive) CMS。官网
  • Ghost:简单、强大的发布平台。官网
  • Apostrophe:提供内容编辑和基本服务的 CMS。官网
  • We.js:适用于实时应用、网站或博客的框架。官网
  • Hatch.js:拥有社交特性的 CMS 平台。官网
  • TaracotJS:拥有快速、极简风格特点且基于Node.js 的 CMS。官网
  • Nodizecms:为 CoffeeScript 爱好者准备的 CMS。官网
  • Cody:拥有所见即所得的编辑器的 CMS。官网
  • PencilBlue:CMS 和博客平台。官网

模板引擎

模板引擎允许您执行字符串插值。
  • mustache.js:是 JavaScript 中带有 {{mustaches}} 的最简模板。官网
  • handlebars.js:是 Mustache 模板语言的扩展。官网
  • hogan.js:是 Mustache 模板语言的编译器。官网
  • doT:最快速简洁的 JavaScript 模板引擎,适用于 nodejs 和浏览器。官网
  • dustjs:适用于浏览器和 node.js 的异步模板。官网
  • eco:嵌入式的 CoffeeScript 模板。官网
  • JavaScript-Templates:轻量(小于 1KB)、快速且无依赖的强大 JavaScript 模版引擎。官网
  • t.js:小巧的 JavaScript 模板框架,压缩后约为 400 字节。官网
  • Jade:健壮的、优雅且功能丰富的 nodejs 模板引擎。官网
  • EJS:高效的 JavaScript 模板。官网
  • xtemplate:可扩展的模板引擎,适用于 node 和浏览器。官网
  • marko:快速轻量且基于 HTML 的模板引擎,支持异步、流、自定义标签和 CommonJS 模编译后输出。适用于 Node.js 官网和浏览器。

数据可视化

Web 数据可视化工具
  • d3:一个对 HTML 和 SVG 进行可视化的 JavaScript 库。官网
  • metrics-graphics:更简洁和拥有更规范的数据图表布局优化算法的库。官网
  • pykcharts.js:经过精心设计后,去除 d3.js 复杂性的 d3.js 图表库。官网
  • three.js:JavaScript 3D 库。官网
  • Chart.js:简单的、基于 canvas 标签的 HTML5 图表库。官网
  • paper.js:是矢量图形脚本中的瑞士军刀 —— 使用 HTML5 Canvas 将 Scriptographer  移植到 JavaScript 官网和浏览器。
  • fabric.js:JavaScript Canvas 库,SVG 与 Canvas 可以相互解析。官网
  • peity:进度条、线状和饼状图。官网
  • raphael:JavaScript 矢量库。官网
  • echarts:商业产品图表。官网
  • vis:动态的、基于浏览器的可视化库。官网
  • two.js:一个渲染器无关的适用于 web 的二维绘图 api 。官网
  • g.raphael:基于 Raphaël 图表库。官网
  • sigma.js:一个致力于图形绘画的 JavaScript 库。官网
  • arbor:一个使用 web workers 和 jQuery 的图形可视化库。官网
  • cubism:可视化时间序列的 D3 插件。官网
  • dc.js:与 crossfilter 无缝合作的多维图表绘制库,使用 d3.js 渲染。官网
  • vega:一套可视化语法。官网
  • processing.js:Processing.js 基于 Web 标准使数据可视化,而无需任何插件。官网
  • envisionjs:动态的 HTML5 可视化。官网
  • rickshaw:用于构建交互式实时图表的 JavaScript 工具包。官网
  • flot:吸引人的、基于 jQuery 的 JavaScript 图表库。官网
  • morris.js:漂亮的时间序列线框图。官网
  • nvd3:一个为 D3.js 构建可复用图表和图表组件的库。官网
  • svg.js:一个轻量的、用于操作和添加 SVG 动画的库。官网
  • heatmap.js:基于 HTML5 canvas 的热力图 JavaScript 库。官网
  • jquery.sparkline:一个直接在浏览器端生成小型走势图的 jQuery 插件。官网
  • xCharts:一个基于 D3、用于构建自定义图表和图形的库。官网
  • trianglify:基于 d3.js 的低多边形(low poly)风格背景图片生成器。官网
  • d3-cloud:创建词云(word cloud)效果的 JavaScript 库。官网
  • d4:一个基于 D3 、友好、可复用的 DSL 图表库 。官网
  • dimple.js:基于 d3 的简易商业分析图表库。官网
  • chartist-js:简单的响应式图表。官网
  • epoch:一个通用的实时图表库。官网
  • c3:基于 D3 的可复用图表库。官网
  • BabylonJS:一个运用 HTML5 和 WebGL 构建 3D 游戏的框架。官网
也有一些很棒的收费库,如 amchartplotly 和 highchart

时间轴

  • TimelineJS: 一个用 JavaScript 编写的可叙事时间轴库。官网
  • timesheet.js:用于构建简单的 HTML5 & CSS3 时间表的 JavaScript 库。官网

编辑器

  • ace:Ace(Ajax.org Cloud9 Editor)。官网
  • CodeMirror:浏览器端的代码编辑器。官网
  • esprima:用于综合分析的 ECMAScript 解析器。官网
  • quill:一个带有 API 的跨浏览器富文本编辑器。(官网)
  • medium-editor:Medium.com 所见即所得编辑器的克隆版。官网
  • pen:享受在线编辑(支持 markdown)。官网
  • jquery-notebook:一个易用的、简洁优雅的文本编辑器。灵感来源于 Medium 的魅力。官网
  • bootstrap-wysiwyg:小巧的、兼容 bootstrap 的所见即所得的富文本编辑器。官网
  • ckeditor-releases:适用于每个人的 web 文本编辑器。官网
  • editor:一个 markdown 编辑器,但仍在开发中。官网
  • EpicEditor:一个可嵌入的 JavaScript Markdown 官网的编辑器,拥有全屏编辑、即时预览、自动保存草稿和离线支持等功能。
  • jsoneditor:查看、编辑和格式化 JSON 的 web 工具。官网
  • vim.js: 拥有持久化 ~/.vimrc 的 Vim 编辑器的 JavaScript 移植版本。官网
  • Squire:HTML5 富文本编辑器。官网
  • TinyMCE:JavaScript 富文本编辑器。官网
  • trix:由 Basecamp 制作,适用于每天写作的富文本编辑器。官网

文件

处理文件的库。
  • Papa Parse:一款强大的 CSV 库,支持解析 CSV 文件/字符串,也能导出 CSV。官网
  • jBinary:对用声明式语法描述文件类型和数据结构的二进制文件,进行高级 I/O(加载、解析、操作、序列化、存储)操作。官网

函数式编程

函数式编程库扩展了 JavaScript 的能力。
  • underscore:JavaScript 的实用工具。官网
  • lodash:提供一致性、可定制、高性能和额外功能的实用库。官网
  • Sugar:一个扩展了原生对象功能的 JavaScript 库。官网
  • lazy.js:类似 Underscore,但性能更优越官网
  • ramda:一个针对 JavaScript 程序员的实用函数库。官网
  • mout:模块化的 JavaScript 工具库。官网
  • mesh:流数据同步工具。官网

响应式编程

响应式程序库扩展了 JavaScript 的能力。
  • RxJs:对 JavaScript 进行响应式扩展。官网
  • Bacon:JavaScript 的 FPR(函数式响应式编程)库。官网
  • Kefir:受 Bacon.js 和 RxJS 启发的 FRP 库,专注于高性能和低内存消耗。官网
  • Highland:对 JavaScript 实用工具的重新思考,Highland 能轻易地管理同步和异步信息,而且仅使用标准 JavaScript 和类 Node 流。官网
  • Most.js:高性能 FRP 库。官网

数据结构

数据结构库用于构建一个更复杂的应用。
  • immutable-js:不可变的数据集合,包括 Sequence、Range、Repeat、Map、OrderedMap、Set 和 sparse Vector。官网
  • mori:使用 ClojureScript 持久化数据结构和支持原生 JavaScript API 的库。官网
  • buckets:完整的、经过充分测试和记录数据结构的 JavaScript 库。官网
  • hashmap:简单的 hashmap 实现,支持任何类型的键值。官网

日期

日期库。
  • moment:解析、验证、操作和显示日期。官网
  • moment-timezone:基于 moment.js 的时区库。官网
  • jquery-timeago:一款支持自动更新模糊时间戳的 jQuery 插件(如:"4 分钟之前")。官网
  • timezone-js:让 JavaScript Date 对象拥有时区功能。使用 Olson zoneinfo 文件记录着时区数据。官网
  • date:拥有人性化的 Date() 方法。官网
  • ms.js:小巧的毫秒转换工具。官网

字符串

字符串库。
  • selecting:一个允许你获取用户选定文本的库。官网
  • underscore.string:扩展了 Underscore.js 的字符串操作。官网
  • string.js:额外的 JavaScript 字符串方法。官网
  • he:健壮的 HTML 实体编码/解码器。官网
  • multiline:多行字符串。官网
  • query-string:解析和字符串化 URL 查询字符串。官网
  • URI.js:URL 操作库。官网 
  • jsurl:轻量的 URL 操作库。官网
  • sprintf.js:实现字符串格式化。官网
  • url-pattern:让 url 和其它字符串进行比正则表达式匹配更简单。字符串和数据可相互转化。官网

数字

  • Numeral-js:对数字进行格式化和操作的库。官网
  • odometer:流畅的数字过渡效果。官网
  • accounting.js:对数字、金钱、货币进行格式化的轻量库——完全本地化和无依赖。官网
  • money.js:一个小巧(1kb)的货币转换库,适用于 web 和 nodeJS。官网
  • Fraction.js:一个有理数库。官网
  • Complex.js: 一个复数库。官网
  • Polynomial.js:一个多项式库。官网

存储

  • store.js:为所有浏览器封装了 LocalStorage,而没有使用 cookies 和 flash。隐秘地使用 localStorage、globalStorage 和用户数据。官网
  • localForage:改善后的离线存储。其封装了 IndexedDB、WebSQL 和 localStorage,拥有操作简单和强大的 API。官网
  • jStorage:jStorage 是一个简单的键值对数据库,用于在浏览器端存储数据。官网
  • cross-storage:获得权限后,能跨域名本地存储。官网
  • basket.js:用 localStorage 加载和缓存脚本的资源加载器。官网
  • bag.js:可以缓存脚本和加载资源,与 basket.js 相似,但增加了键值对接口和对 localStorage / websql / 官网undexedDB 的支持。
  • basil.js:智能的 JavaScript 数据持久层库。官网
  • jquery-cookie:轻量简单的、用于读取、编辑和删除 cookie 的 jQuery 插件。官网
  • Cookies:客户端 Cookie 操作库。官网
  • DB.js:基于 Promise 的、封装了 IndexDB 的库。官网
  • lawnchair.js:简单的客户端 JSON 存储。官网

颜色

  • randomColor:JavaScript 颜色生成器。官网
  • chroma.js:拥有各种各样颜色操作的 JavaScript 库。官网
  • color:JavaScript 颜色转换和操作库。官网
  • colors:更智能的默认 web 颜色。官网
  • PleaseJS:随机创建出赏心悦目的颜色和配色方案。官网
  • TinyColor:快速、轻巧的颜色操作和转换库。官网
  • Vibrant.js:从图像提取主要颜色。官网

国际化和本地化(I18n And L10n)

本地化和国际化 JavaScript 库
  • i18next:JavaScript 最简单的国际化(i18n)方法。官网
  • polyglot:小巧的国际化助手库。官网
  • babelfish:i18n 提供友好易懂的 API ,并且内置多种支持。官网

  • ClassManager:世界上最快、最方便的类系统之一。官网
  • klass:用于创建极富表现力的类工具库。官网
  • augment:世界上最小且最快的一流 JavaScript 继承模式。官网

控制流

  • async:适用于 node 和浏览器的异步工具库。官网
  • q:实现异步的 promise JavaScript 库。官网
  • step:让逻辑顺序合理化的异步控制流库。官网
  • contra:利用函数风格实现的异步流控制。官网
  • Bluebird:专注于革新功能和性能的,功能齐全的 promoise 库。官网
  • when:快速可靠的、Promises/A+ 规范的 when() 实现,而且拥有异步其它的优秀特性。官网
  • ObjectEventTarget:提供增加了事件监听的原型(与 DOMElement 的 EventTarget 在浏览器行为一致)。官网

路由

  • director:一个小巧的、与 URL 同构的路由器。官网
  • page.js:受 Express router 启发的小型客户端路由器(约为1200字节)。官网
  • pathjs:简单、轻量的 web 路由器。官网
  • crossroads:JavaScript 路由。官网
  • davis.js:使用 pushState、RESTful 风格和可降级的 JavaScript 路由器。官网
  • angular-ui-router:基于AngularJS的可嵌套路由。官网

安全性

  • DOMPurify:针对 HTML、MathML 和 SVG 的仅支持DOM、快速、高容错的 XSS 过滤器。官网
  • js-xss:通过白名单配置,即可过滤不信任的 HTML(防止 XSS 攻击)。官网

日志

  • log:带有样式的 Console.log。官网
  • Conzole:对 JavaScript 原生 console 对象方法和功能进行封装的 debug 面板,使其显示在页面内。官网
  • console.log-wrapper:将日志清晰地记录到 console,且兼容所有浏览器。官网
  • loglevel:最轻量的 JavaScript 日志记录工具库,向封装后可用的 console.log 方法增加可靠的日志等级。官网
  • minilog:轻量的、用流式 API 显示的、可用于客户端和服务器端的日志记录库。官网

正则表达式

  • RegEx101:在线的 JavaScript 正则表达式测试器和调试器。同时支持 Python、PHP 和 PCRE。官网
  • RegExr:用于创建、测试和学习正则表达式的 HTML/JS  工具。官网
  • RegExpBuilder:使用链式方法创建正则表达式。官网

媒体

  • Ion.Sound:可用于任何网页上简单音频。官网

语音命令

  • annyang:向网站添加语音命令的语音识别库。官网
  • voix.js:向网站、app 或游戏添加语音命令的 JavaScript 库。官网

API

  • bottleneck:强大的频率限制器,使调节流量变得更容易。官网
  • oauth-signature-js:适用于 node 和 浏览器的 OAuth 1.0a 签名生成器。官网
  • amygdala:为 Web 应用提供 RESTful HTTP 客户端解决方案。官网
  • jquery.rest:一个让 RESTful API 更易使用的 jQuery 插件。官网

视觉检测

  • tracking.js:在 web 上实现计算视觉的一种现代方法。官网
  • ocrad.js:通过 Emscripten 用 JavaScript 实现 OCR(光学字符识别)。官网

浏览器检测

  • bowser:一个浏览器检测器。官网

UI

代码高亮

  • Highlight.js:JavaScript 语法高亮器。官网
  • PrismJS:轻量、健壮和优雅的语法高亮器。官网

加载状态

指示加载状态的库。
  • Mprogress.js:创建谷歌 Material 设计风格的线性进度条。官网
  • NProgress:在 Ajax'y 应用显示细长型进度条官网
  • Spin.js:一个旋转的进度指示器。官网
  • progress.js:为页面任何对象创建和管理进度条。官网
  • progressbar.js:用 SVG path 动画制作的、漂亮和响应式的进度条。官网
  • pace:自动向你的网站添加一个进度条。官网
  • topbar:小巧漂亮的、与网站同宽的进度指示器。官网
  • nanobar:非常轻量的进度条。不依赖 jQuery。官网
  • PageLoadingEffects:使用 SVG 动画展现新内容的现代方式。官网
  • SpinKit:运用 CSS 动画的加载指示器集合。官网
  • Ladda:内置在按钮的加载指示器。官网
  • css-loaders:运用 CSS 动画的旋转加载指示器的集合。官网
除了上述这些库,还有收藏在 Codepen 的,另外还有 AjaxloadPreloaders 和 CSSLoad 这些生成器。

验证

  • Parsley.js:不用写一行 JavaScript 代码即可在前端验证表单。官网
  • jquery-validation:jQuery 验证插件。官网
  • validator.js:字符串验证和过滤(在使用用户输入之前清理用户输入中的有害或危险字符的操作)。官网
  • validate.js:受 CodeIgniter 启发的轻量表单验证 JavaScript 库。官网
  • validatr:跨浏览器的 HTML5 表单验证库。官网
  • BootstrapValidator:是验证表单域中最好的 jQuery 插件。要与 Bootstrap 3 一起使用。官网
  • is.js:检查类型、正则表达式、是否存在、时间等。官网
  • FieldVal:多用途验证库。同时支持同步和异步验证。官网

键盘封装器

  • mousetrap:处理键盘快捷键的 JavaScript 库。官网
  • keymaster:定义和调度键盘快捷键的小型库。官网
  • Keypress:键入捕捉工具库,任何键都可以成为一个修饰健。官网
  • KeyboardJS:一个用于绑定键盘组合的 JavaScript 库,让你脱离快捷键和快捷键组合冲突的痛苦。官网
  • jquery.hotkeys:jQuery Hotkeys 能让你在代码任何的地方监听键盘事件,并几乎支持所有按键组合。官网
  • jwerty:令人惊叹的键盘事件处理库。官网

浏览和引导

  • intro.js:这是一个介绍新功能的很好方式,能一步步地引导用户浏览你的网站和项目。官网
  • shepherd:通过引导让用户浏览你的应用程序。官网
  • bootstrap-tour:应用 Twitter Bootstrap 弹出框对产品进行快速简单的引导。官网
  • tourist:简单、灵活的应用引导介绍库。官网
  • chardin.js:简单的应用遮罩层介绍。官网
  • pageguide:使用 jQuery 和 CSS3 的 web 页面元素交互引导库。官网
  • hopscotch:让开发者更容易向其页面产品添加引导的框架。官网
  • joyride:基于 jQuery 的功能引导插件。官网
  • focusable:通过向页面其余部分添加遮罩层,使焦点聚集在特定 DOM 元素。官网

通知

  • messenger:为你的应用添加 Growl-style 弹框和信息(Crowl 是 Mac OS X 下的一个通知系统)。官网
  • noty:jQuery 通知插件。官网
  • pnotify:适用于 Bootstrap、jQuery UI 和 Web Notifications Draft 的 JavaScript 通知库。官网
  • toastr:用来显示简单的,会自动到期的信息窗口)简单的弹出框通知(toast notifications官网
  • humane-js:一个简单、时髦的浏览器通知系统。官网
  • smoke.js:与框架无关的、能够自定义样式的 JavaScript 弹框系统。官网

幻灯片

  • Swiper:使用硬件加速过渡的移动设备触控滑块框架。官网
  • slick:你所需要的最后一个轮播插件。官网
  • slidesJs:响应式的 jQuery(1.7.1+)幻灯片插件,具有触摸、 CSS3 过渡等特性。官网
  • FlexSlider:一款令人惊叹的、全响应式的幻灯片 jQuery 插件。官网
  • unslider:最简单的幻灯片 jQuery 插件。官网
  • colorbox:轻量、可自定义的灯箱 jQuery 插件。官网
  • fancyBox:提供了良好优雅的方式,为页面上的图片、html 内容和多媒体添加缩放功能的工具。官网
  • sly:基于项导航的、支持单向滚动的 JavaScript 库。官网
  • vegas:向页面添加漂亮的全屏背景的 jQuery 插件,甚至允许幻灯片。官网
  • Sequence:用于创建响应式的幻灯片、演示、旗帜广告和以步骤为基础的应用的 CSS 动画框架。官网
  • baguetteBox.js:易于使用的、用纯 JavaScript 实现的遮罩层脚本。官网
  • reveal.js:用 HTML 创建漂亮演示控件的框架。官网
  • PhotoSwipe:适用于移动设备和桌面电脑的、模块化和不无依赖框架的 JavaScript 画廊控件。官网
  • jcSlider:用 CSS 动画实现的响应式幻灯片 jQuery 插件。官网
  • basic-jquery-slider:易于使用、指定主题和定制化。官网
  • unslider: 这是最简单的幻灯片 jQuery 插件。官网
  • jQuery.adaptive-slider:带有自适应颜色标题和导航的幻灯片 jQuery 插件。官网
  • slidr:可添加一些幻灯片效果。官网
  • Flickity:可触摸的、响应式的和可轻弹的画廊。官网

滑块控件

  • Ion.RangeSlider:强大的、易于自定义的范围滑块选择库,支持很多配置和皮肤。官网
  • jQRangeSlider:支持日期的滑块选择库。官网
  • noUiSlider:轻量无冗余的、高度定制化的滑块选择库。官网
  • rangeslider.js:HTML5  input 区域滑块元素。官网

表单组件

输入

  • typeahead.js:快速的、功能齐全的自动补全库。官网
  • tag-it:处理多标签字段以及标签建议/自动完成的 jQuery UI 插件。官网
  • At.js:向你的应用添加类似 Github 的自动完成提示功能。官网
  • Placeholders.js:JavaScript 补全 HTML5 占位符的属性。官网
  • fancyInput:利用 CSS3 效果让输入更有趣。官网
  • jQuery-Tags-Input:利用这个 jQuery 插件,可奇妙地将一个简单的文本输入转换成一个酷酷的标签列表。官网
  • vanilla-masker:一个纯 JavaScript 实现的输入控制库。官网
  • Ion.CheckRadio:一个为复选框和单选按钮添加样式的 jQuery 库,支持多种皮肤。官网

日历

  • pickadate.js:对移动设备友好的、响应式的和轻量的 jQuery 日期 & 时间输入选择器。官网
  • bootstrap-datepicker:基于 bootstrap 的日历选择器。官网
  • Pikaday:一个崭新的 JavaScript 日期选择器 —— 轻量、无依赖和模块化的 CSS。官网
  • fullcalendar:全尺寸、支持拖放事件的日历(jQuery 插件)。官网
  • rome:可定制的日期(和时间)选择器。无依赖,可选 UI。官网
  • datedropper: datedropper 是一个 jQuery 插件,它提供了快速简易的方式去管理日期输入框。官网

选择

  • selectize.js:Selectize 是文本框和选择框的混合体。它基于jQuery,拥有自动完成和键盘感应下拉列表功能,可用于标签、联系人列表等。官网
  • select2:它基于 jQuery,是选择框(select box)的替代品。支持搜索、远程数据集和无限滚动。官网
  • chosen:可以让冗长不便的选择框更友好的库。官网

文件上传

  • jQuery-File-Upload:File Upload 是一个支持多文件选择、文件拖放、进度条、验证和图片、音频、视频预览的 官网jQuery 插件。
  • dropzone:Dropzone 是一个易于使用且支持多文件拖放的库。其支持图片预览并且拥有很好的进度条效果。官网
  • flow.js:一个通过 HTML5 的 File API ,提供多个同时链接的、稳定的、容错的、可恢复的/可重新开始的文件上传库。官网
  • fine-uploader:一个带有进度条、拖放功能和支持直接上传到 S3 (Amazon Simple Storage Service,亚马逊简易存储服务)的多文件上传插件。官网
  • FileAPI:JavaScript 文件工具集合。支持多文件上传、拖放和文件分块上传。对于图像,支持裁剪、调整大小和根据 EXIF 自动调整方向。官网
  • plupload:处理文件上传的 JavaScript 官网API,其支持多文件选择、文件类型过滤、分块请求、客户端图片缩放和根据不同的运行环境选择 HTML5、Silverlight 和 Flash。

其它

  • form:jQuery 表单插件。官网
  • Garlic.js:自动在本地保存表单文本和选择框的值,直到表单被提交。官网
  • Countable:对某个 HTML 元素包含文本的段落数、单词数和字符数进行统计的 JavaScript 函数。官网
  • card:只需一行代码,让信用卡表单变得更友好。官网
  • stretchy:自适应大小的 form 元素,表单本应该是这样的。官网
  • list.js:向表格、列表等 HTML 元素添加搜索、排序、过滤和自适应功能的库。在已有 HTML 上增加可视化。 官网

提示

  • tipsy:基于 jQuery 的 Fackbook 风格的提示工具(tooltip)。官网
  • opentip:开源且基于 prototype 框架的 JavaScript 工具提示库。官网
  • qTip2:非常强大的工具提示库。官网
  • tooltipster:一个工具提示 jQuery 插件。官网
  • simptip:用 Sass 制作的、简单的工具提示。官网
  • jquery-popup-overlay:是一个响应式的和可访问性强的模态框(modal)和工具提示框 jQuery 插件。官网

模态框和弹出框

  • Magnific-Popup:专注于性能、轻量、响应式的灯箱(lightbox)脚本。官网
  • jquery-popbox:jQuery 提示框插件。官网
  • jquery.avgrund.js:一种新的定于弹出的模态框 jQuery 插件。官网
  • vex:新的、拥有高度可配置和易于改变样式功能的对话框库。官网
  • bootstrap-modal:对 Bootstrap 默认的模态框类进行扩展。其支持响应式、可堆叠和 ajax 等。官网
  • css-modal:纯 CSS 打造的模态框。官网
  • jquery-popup-overlay:是一个响应式的和可访问性强的模态框和工具提示框(tooltips)jQuery 插件。官网

滚动

  • scrollMonitor:滚动发生时,可以监听元素的、简单、快速的 API。官网
  • headroom:除非你需要显示页面头部(header),否则将隐藏它,以腾出页面头部空间。官网
  • onepage-scroll:创建一个类似 Apple 的单页面滚动网站(iPhone 5S  网站)。官网
  • iscroll:高性能、轻量、无依赖、兼容多平台的 JavaScript 滚动组件。官网
  • skrollr:独立(不依赖 jQuery) 的视差滚动库,适用于移动设备(Android + iOS)和桌面电脑。官网
  • parallax:面向智能设备的视差引擎。官网
  • stellar.js:让视差滚动变简单。官网
  • plax:基于 jQuery 的视差库。官网
  • jparallax:创建可交互视差效果的 jQuery 插件。官网
  • fullPage:简单和易于使用的、用于创建全屏滚动网站的插件(也被称为单页面网站)。官网
  • ScrollMenu:让老旧无聊的滚动条焕然一新。官网

菜单

  • jQuery-menu-aim:当用户光标放在特定下拉菜单项时触发事件。可制作响应式的、大数据量的下拉菜单,如 Amazon 的。官网
  • jQuery contextMenu:右键菜单(contextMenu) 管理工具。官网
  • Slideout:为移动设备的 web 应用制作出响应式的、可触摸滑出的导航菜单。官网
  • Slide and swipe:一个基于 touchSwipe 库的滑出菜单插件。官网

表格/栅格

  • jTable:基于 CRUD 表创建 AJAX 的 jQuery 插件。官网
  • DataTables:这是一个非常灵活的工具,在渐进增强的基础上,将高级的交互效果加到 HTML 表格。(jQuery 插件)官网 
  • floatThead:(jQuery 插件)锁定表格头部,只允许表格内容滚动。适用于任何表格,而且不需要额外的 html 或 css。官网
  • Masonry:瀑布流式的网格布局库。官网
  • Packery:使用装箱算法(bin-packing)的网格布局库。支持拖拽布局。官网
  • Isotope:可过滤和可排序的网格布局的库,它能实现 Masonry、Packery 等布局。官网

框架

  • Semantic UI:拥有大量主题和元素的 UI 套件。官网

手势

  • hammer.js:拥有多种触摸手势的 JavaScript 库。官网
  • touchemulator:在桌面电脑模仿触摸输入。官网
  • Dragula:超级易于使用的拖拽库。官网

地图

  • Leaflet:对移动设备友好的、可交互的地图 JavaScript 库。官网
  • Cesium:开源的、基于 WebGL 实现的虚拟地球仪和地图引擎。官网
  • gmaps:以最简单的方式使用 Google 地图。官网
  • polymaps:一个免费的、兼容现代 web 浏览器的、用于制作动态可交互的地图 JavaScript 库。官网
  • kartograph.js:开源的 Kartograph SVG 地图渲染器。官网
  • mapbox.js:Mapbox 的 API,Leaflet 的插件。官网
  • jqvmap:矢量地图 jQuery 插件。官网
  • OpenLayers3:高性能的、功能丰富的库,能满足你对地图所有需求。官网

视频/音频

  • prettyembed.js:更完美地嵌入 YouTube —— 拥有很好的选项,如高分辨率的预览图、嵌入选项的高级定制和可选的 官网FitVids 支持。
  • html5media:能在所有主流浏览器播放多媒体标签中定义的多媒体文件。官网
  • Play-em JS:Play'em 是一个 JavaScript 组件,它能管理音乐/视频播放顺序,通过在一个 DIV 元素里嵌入几个播放器(Youtube、Soundcloud 和 Vimeo)来控制一系列歌曲的播放。官网
  • polyplayer:将 YouTube、Soundcloud 和 Vimeo 播放器的 API 统一成一套。官网
  • flowplayer: HTML5 视频播放器 官网Github
  • mediaelement:让 HTML5、 Flash 播放器和模仿 HTML5 媒介元素 API 的 Silverlight shim,在所有浏览器拥有一致的 UI。官网Github
  • SoundJS:让音频在 web 上运行更简单的库。它为不同浏览器提供了一致的 API。官网

动画

  • velocity:加速 JavaScript 动画。官网
  • jquery.transit:拥有超级流畅的 CSS3 变换和过渡的 jQuery 插件。官网
  • impess.js:在 HTML 文档里,运用 CSS3 变换和过渡制作类似 Prezi 的展现效果。官网
  • bounce.js:可以立刻创建有趣的 CSS3 动画。官网
  • GreenSock-JS:适用于所有主流浏览器的高性能 HTML5 动画。官网
  • TransitionEnd:TransitionEnd 是一个运用 transitonend 事件的、跨浏览器的库。官网
  • Dynamics.js:用于创建基于物理知识的 CSS 动画库。官网

图片处理

  • lena.js:拥有滤镜和实用功能的图像处理库。官网
  • pica:高质量地调整图片大小(拥有快速的、纯 JS 实现的 Lanczos 滤镜算法)。官网
  • cropper:一个简单的图像裁剪 jQuery 插件。官网

ECMAScript 6

  • es6features:ECMAScript 6 特性概述。官网
  • es6-features:ECMAScript 6:  特性概述和比较。官网
  • ECMAScript 6 compatibility table :Compatibility tables 展示了各种平台上所有 ECMAScript 6 特性的支持程度。官网
  • Babel (Formerly 6to5):将 ES6+ 代码转换成纯 ES5。官网
  • Traceur compiler:ES6 特性转 ES5。包括 classes、generators、promises、destructuring 官网patterns、default parameters 等。

软件开发工具包(SDK)

  • javascript-sdk-design:从工作和个人经验中提炼出来的 JavaScript SDK 设计指导。官网

大杂烩

  • echo:利用 data-* 属性延迟加载图片。官网
  • picturefill:响应式图片显示插件,使浏览器支持 srcset、size 属性。官网
  • platform.js:一个平台检测库,几乎适用于所有 JavaScript 平台。官网
  • json3:一个现代 JSON 实现库,几乎兼容所有 JavaScript 平台。官网
  • Logical Or Not:一个关于 JavaScript 特性的游戏。官网
  • BitSet.js:实现位向量的 JavaScript 库。官网

精品阅读

资源

有影响力的书

具有广泛影响且值得阅读的前端经典书籍。
*《Limu:JavaScript 的那些书

知名网站

值得关注的前端技术站点。

中文站点

  • 伯乐在线前端频道:伯乐前端分享 Web 前端开发,包括 JavaScript、CSS 和 HTML5 开发技术,前端相关的行业动态。官网
from  https://github.com/jobbole/awesome-javascript-cn
---------------------


Awesome JavaScript Awesome

A collection of awesome browser-side JavaScript libraries, resources and shiny things.

Package Managers

Host the javascript libraries and provide tools for fetching and packaging them.
  • npm - npm is the package manager for javascript.
  • Bower - A package manager for the web.
  • component - Client package management for building better web applications.
  • spm - Brand new static package manager.
  • jam - A package manager using a browser-focused and RequireJS compatible repository.
  • jspm - Frictionless browser package management.
  • Ender - The no-library library.
  • volo - Create front end projects from templates, add dependencies, and automate the resulting projects.
  • Duo - Next-generation package manager that blends the best ideas from Component, Browserify and Go to make organizing and writing front-end code quick and painless.

Loaders

Module or loading system for JavaScript.
  • RequireJS - A file and module loader for JavaScript.
  • browserify - Browser-side require() the node.js way.
  • SeaJS - A Module Loader for the Web.
  • HeadJS - The only script in your HEAD.
  • curl - A small, fast, extensible module loader that handles AMD, CommonJS Modules/1.1, CSS, HTML/text, and legacy scripts.
  • lazyload - Tiny, dependency-free async JavaScript and CSS loader.
  • script.js - Asyncronous JavaScript loader and dependency manager.
  • systemjs - AMD, CJS & ES6 spec-compliant module loader.
  • LodJS - Module loader based on AMD
  • ESL - Module loader browser first, support lazy define and AMD.
  • modulejs - Lightweight JavaScript module system.

Bundlers

  • browserify - Browserify lets you require('modules') in the browser by bundling up all of your dependencies.
  • webpack - Packs CommonJs/AMD modules for the browser.
  • Rollup - Next-generation ES6 module bundler.
  • Brunch - Fast front-end web app build tool with simple declarative config.

Testing Frameworks

Frameworks

  • mocha - Simple, flexible, fun javascript test framework for node.js & the browser.
  • jasmine - DOM-less simple JavaScript testing framework.
  • qunit - An easy-to-use JavaScript Unit Testing framework.
  • jest - Painless Javascript Unit Testing.
  • prova - Node & Browser test runner based on Tape and Browserify
  • DalekJS - Automated cross browser functional testing with JavaScript
  • Protractor - Protractor is an end-to-end test framework for AngularJS applications.

Assertion

  • chai - BDD / TDD assertion framework for node.js and the browser that can be paired with any testing framework.
  • Sinon.JS - Test spies, stubs, and mocks for JavaScript.
  • expect.js - Minimalistic BDD-style assertions for Node.JS and the browser.

Coverage

  • istanbul - Yet another JS code coverage tool.
  • blanket - A simple code coverage library for javascript. Designed to be easy to install and use, for both browser and nodejs.
  • JSCover - JSCover is a tool that measures code coverage for JavaScript programs.

Runner

  • phantomjs - Scriptable Headless WebKit.
  • slimerjs - A PhantomJS-like tool running Gecko.
  • casperjs - Navigation scripting & testing utility for PhantomJS and SlimerJS.
  • zombie - Insanely fast, full-stack, headless browser testing using node.js.
  • totoro - A simple and stable cross-browser testing tool.
  • karma - Spectacular Test Runner for JavaScript.
  • nightwatch - UI automated testing framework based on node.js and selenium webdriver.
  • intern - A next-generation code testing stack for JavaScript.
  • yolpo - A statement-by-statement javascript interpreter in the browser.

QA Tools

  • JSHint - JSHint is a tool that helps to detect errors and potential problems in your JavaScript code.
  • jscs - JavaScript Code Style checker.
  • jsfmt - For formatting, searching, and rewriting JavaScript.
  • jsinspect - Detect copy-pasted and structurally similar code.
  • buddy.js - Magic number detection for JavaScript.
  • ESLint - A fully pluggable tool for identifying and reporting on patterns in JavaScript.
  • JSLint - High-standards, strict & opinionated code quality tool, aiming to keep only good parts of the language.

MVC Frameworks and Libraries

  • angular.js - HTML enhanced for web apps.
  • aurelia - A Javascript client framework for mobile, desktop and web.
  • backbone - Give your JS App some Backbone with Models, Views, Collections, and Events.
  • batman.js - The best JavaScript framework for Rails developers.
  • ember.js - A JavaScript framework for creating ambitious web applications.
  • meteor - An ultra-simple, database-everywhere, data-on-the-wire, pure-Javascript web framework.
  • ractive - Next-generation DOM manipulation.
  • vue - Intuitive, fast & composable MVVM for building interactive interfaces.
  • knockout - Knockout makes it easier to create rich, responsive UIs with JavaScript.
  • spine - Lightweight MVC library for building JavaScript applications.
  • espresso.js - A minimal javascript library for crafting user interfaces.
  • canjs - Can do JS, better, faster, easier.
  • react - A library for building user interfaces. It's declarative, efficient, and extremely flexible. Works with a Virtual DOM.
  • preact - Fast 3kb React alternative with the same ES6 API. Components & Virtual DOM.
  • react-native - A framework for building native apps with React.
  • riot - React-like library, but with very small size.
  • thorax - Strengthening your Backbone.
  • chaplin - An architecture for JavaScript applications using the Backbone.js library.
  • marionette - A composite application library for Backbone.js that aims to simplify the construction of large scale JavaScript applications.
  • ripple - A tiny foundation for building reactive views.
  • rivets - Lightweight and powerful data binding + templating solution.
  • derby - MVC framework making it easy to write realtime, collaborative applications that run in both Node.js and browsers.
  • way.js - Simple, lightweight, persistent two-way databinding.
  • mithril.js - Mithril is a client-side MVC framework (Light-weight, Robust, Fast).
  • jsblocks - jsblocks is better MV-ish framework.
  • LiquidLava - Transparent MVC framework for building user interfaces.
  • feathers - A minimalist real-time JavaScript framework for tomorrow's apps.
  • Keo - Functional stateless React components with Shadow DOM support.

Node-Powered CMS Frameworks

  • KeystoneJS - powerful CMS and web app framework
  • Reaction Commerce - reactive CMS, real-time architecture and design
  • Ghost - simple, powerful publishing platform
  • Apostrophe - CMS with content editing and essential services
  • We.js - framework for real time apps, sites or blogs
  • Hatch.js - CMS platform with social features.
  • TaracotJS - fast and minimalist CMS based on Node.js.
  • Nodizecms - CMS for CoffeeScript lovers
  • Cody - CMS with WSYWYG editor
  • PencilBlue - CMS and blogging platform

Templating Engines

Templating engines allow you to perform string interpolation.
  • mustache.js - Minimal templating with {{mustaches}} in JavaScript.
  • handlebars.js - An extension to the Mustache templating language.
  • hogan.js - A compiler for the Mustache templating language.
  • doT - The fastest + concise javascript template engine for nodejs and browsers.
  • dustjs - Asynchronous templates for the browser and node.js.
  • eco - Embedded CoffeeScript templates.
  • JavaScript-Templates - < 1KB lightweight, fast & powerful JavaScript templating engine with zero dependencies.
  • t.js - A tiny javascript templating framework in ~400 bytes gzipped.
  • Jade - Robust, elegant, feature rich template engine for nodejs.
  • EJS - Effective JavaScript templating.
  • xtemplate - eXtensible Template Engine lib for node and the browser
  • marko - A fast, lightweight, HTML-based templating engine for Node.js and the browser with async, streaming, custom tags and CommonJS modules as compiled output.
  • swig - A simple, powerful, and extendable Node.js and browser-based JavaScript template engine.

Articles and Posts

Data Visualization

Data visualization tools for the web.
  • d3 - A JavaScript visualization library for HTML and SVG.
    • metrics-graphics - A library optimized for concise, principled data graphics and layouts.
  • pykcharts.js - Well designed d3.js charting without the complexity of d3.js.
  • three.js - JavaScript 3D library.
  • Chart.js - Simple HTML5 Charts using the tag.
  • paper.js - The Swiss Army Knife of Vector Graphics Scripting – Scriptographer ported to JavaScript and the browser, using HTML5 Canvas.
  • fabric.js - Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser.
  • peity - Progressive bar, line and pie charts.
  • raphael - JavaScript Vector Library.
  • echarts - Enterprise Charts.
  • vis - Dynamic, browser-based visualization library.
  • two.js - A renderer agnostic two-dimensional drawing api for the web.
  • g.raphael - Charts for Raphaël.
  • sigma.js - A JavaScript library dedicated to graph drawing.
  • arbor - A graph visualization library using web workers and jQuery.
  • cubism - A D3 plugin for visualizing time series.
  • dc.js - Multi-Dimensional charting built to work natively with crossfilter rendered with d3.js
  • vega - A visualization grammar.
  • processing.js - Processing.js makes your data visualizations work using web standards and without any plug-ins
  • envisionjs - Dynamic HTML5 visualization.
  • rickshaw - JavaScript toolkit for creating interactive real-time graphs.
  • flot - Attractive JavaScript charts for jQuery.
  • morris.js - Pretty time-series line graphs.
  • nvd3 - Build re-usable charts and chart components for d3.js
  • svg.js - A lightweight library for manipulating and animating SVG.
  • heatmap.js - JavaScript Library for HTML5 canvas based heatmaps.
  • jquery.sparkline - A plugin for the jQuery javascript library to generate small sparkline charts directly in the browser.
  • xCharts - A D3-based library for building custom charts and graphs.
  • trianglify - Low poly style background generator with d3.js
  • d3-cloud - Create word clouds in JavaScript.
  • d4 - A friendly reusable charts DSL for D3.
  • dimple.js - Easy charts for business analytics powered by d3
  • chartist-js - Simple responsive charts.
  • epoch - A general purpose real-time charting library.
  • c3 - D3-based reusable chart library.
  • BabylonJS - A framework for building 3D games with HTML 5 and WebGL.
  • recharts - Redefined chart library built with React and D3
There're also some great commercial libraries, like amchartanychartplotly, and highchart.

Timeline

  • TimelineJS - A Storytelling Timeline built in JavaScript.
  • timesheet.js - JavaScript library for simple HTML5 & CSS3 time sheets.

Spreadsheet

  • HANDSONTABLE - Handsontable is a JavaScript/HTML5 Spreadsheet Library for Developers

Editors

  • ace - Ace (Ajax.org Cloud9 Editor).
  • CodeMirror - In-browser code editor.
  • esprima - ECMAScript parsing infrastructure for multipurpose analysis.
  • quill - A cross browser rich text editor with an API.
  • medium-editor - Medium.com WYSIWYG editor clone.
  • pen - enjoy live editing (+markdown).
  • jquery-notebook - A simple, clean and elegant text editor. Inspired by the awesomeness of Medium.
  • bootstrap-wysiwyg - Tiny bootstrap-compatible WYSIWYG rich text editor.
  • ckeditor-releases - The best web text editor for everyone.
  • editor - A markdown editor. still on development.
  • EpicEditor - An embeddable JavaScript Markdown editor with split fullscreen editing, live previewing, automatic draft saving, offline support, and more.
  • jsoneditor - A web-based tool to view, edit and format JSON.
  • vim.js - JavaScript port of Vim with a persistent ~/.vimrc
  • Squire - HTML5 rich text editor.
  • TinyMCE - The JavaScript Rich Text editor.
  • trix - A rich text editor for everyday writing. By Basecamp.
  • Trumbowyg - A lightweight and amazing WYSIWYG JavaScript editor.
  • Draft.js - A React framework for building text editors.
  • bootstrap-wysihtml5 - Simple, beautiful wysiwyg editor
  • wysihtml5 - Open source rich text editor based on HTML5 and the progressive-enhancement approach. Uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag soups and inline styles.
  • raptor-editor - Raptor, an HTML5 WYSIWYG content editor!
  • popline - Popline is an HTML5 Rich-Text-Editor Toolbar

Documentation

  • DevDocs is an all-in-one API documentation reader with a fast, organized, and consistent interface.
  • dexy is a free-form literate documentation tool for writing any kind of technical document incorporating code.
  • docco is a quick-and-dirty, hundred-line-long, literate-programming-style documentation generator.
  • styledocco generates documentation and style guide documents from your stylesheets.
  • Ronn builds manuals. It converts simple, human readable textfiles to roff for terminal display, and also to HTML for the web.
  • dox is a JavaScript documentation generator written with node. Dox no longer generates an opinionated structure or style for your docs, it simply gives you a JSON representation, allowing you to use markdown and JSDoc-style tags.
  • jsdox is a JSDoc3 to Markdown documentation generator.
  • YUIDoc is a Node.js application that generates API documentation from comments in source, using a syntax similar to tools like Javadoc and Doxygen.
  • coddoc is a jsdoc parsing library. Coddoc is different in that it is easily extensible by allowing users to add tag and code parsers through the use of coddoc.addTagHandler and coddoc.addCodeHandler. coddoc also parses source code to be used in APIs.
  • sphinx a tool that makes it easy to create intelligent and beautiful documentation
  • Using JSDoc
  • Beautiful docs is a documentation viewer based on markdown files.
  • documentation.js - API documentation generator with support for ES2015+ and flow annotation.
  • jsduck - API documentation generator made for Sencha JavaScript frameworks, but can be used for other frameworks too.

Files

Libraries for working with files.
  • Papa Parse - A powerful CSV library that supports parsing CSV files/strings and also exporting to CSV.
  • jBinary - High-level I/O (loading, parsing, manipulating, serializing, saving) for binary files with declarative syntax for describing file types and data structures.
  • diff2html - Git diff output parser and pretty HTML generator.
  • jsPDF - JavaScript PDF generation.

Functional Programming

Functional programming libraries to extend JavaScript’s capabilities.
  • underscore - JavaScript's utility _ belt.
  • lodash - A utility library delivering consistency, customization, performance, & extras.
  • Sugar - A Javascript library for working with native objects.
  • lazy.js - Like Underscore, but lazier.
  • ramda - A practical functional library for Javascript programmers.
  • mout - Modular JavaScript Utilities.
  • mesh - Streamable data synchronization utility.

Reactive Programming

Reactive programming libraries to extend JavaScript’s capabilities.
  • RxJs - The Reactive Extensions for JavaScript.
  • Bacon - FRP (functional reactive programming) library for Javascript.
  • Kefir - FRP library for JavaScript inspired by Bacon.js and RxJS with focus on high performance and low memory consumption.
  • Highland - Re-thinking the JavaScript utility belt, Highland manages synchronous and asynchronous code easily, using nothing more than standard JavaScript and Node-like Streams.
  • Most.js - high performance FRP library.
  • MobX - TFRP library for simple, scalable state management.
  • Cycle.js - A functional and reactive JavaScript library for cleaner code.

Data Structure

Data structure libraries to build a more sophisticated application.
  • immutable-js - Immutable Data Collections including Sequence, Range, Repeat, Map, OrderedMap, Set and a sparse Vector.
  • mori - A library for using ClojureScript's persistent data structures and supporting API from the comfort of vanilla JavaScript.
  • buckets - A complete, fully tested and documented data structure library written in JavaScript.
  • hashmap - Simple hashmap implementation that supports any kind of keys.

Date

Date Libraries.
  • moment - Parse, validate, manipulate, and display dates in javascript.
  • moment-timezone - Timezone support for moment.js.
  • jquery-timeago - A jQuery plugin that makes it easy to support automatically updating fuzzy timestamps (e.g. "4 minutes ago").
  • timezone-js - Timezone-enabled JavaScript Date object. Uses Olson zoneinfo files for timezone data.
  • date - Date() for humans.
  • ms.js - Tiny millisecond conversion utility.
  • countdown.js - Super simple countdowns.
  • timeago.js - Simple library (less then 2kb) used to format date with *** time ago statement.
  • fecha - Lightweight date formatting and parsing (~2KB). Meant to replace parsing and formatting functionality of moment.js.

String

String Libraries.
  • selecting - A library that allows you to access the text selected by the user
  • underscore.string - String manipulation extensions for Underscore.js javascript library.
  • string.js - Extra JavaScript string methods.
  • he - A robust HTML entity encoder/decoder written in JavaScript.
  • multiline - Multiline strings in JavaScript.
  • query-string - Parse and stringify URL query strings.
  • URI.js - Javascript URL mutation library.
  • jsurl - Lightweight URL manipulation with JavaScript.
  • sprintf.js - A sprintf implementation.
  • url-pattern - Easier than regex string matching patterns for urls and other strings. Turn strings into data or data into strings

Number

  • Numeral-js - A javascript library for formatting and manipulating numbers.
  • chance.js - Random generator helper in Javascript. Can generate numbers, strings etc.
  • odometer - Smoothly transitions numbers with ease.
  • accounting.js - A lightweight JavaScript library for number, money and currency formatting - fully localisable, zero dependencies.
  • money.js - A tiny (1kb) javascript currency conversion library, for web & nodeJS.
  • Fraction.js - A rational number library for JavaScript
  • Complex.js - A complex number library for JavaScript
  • Polynomial.js - A polynomials library for JavaScript

Storage

  • store.js - LocalStorage wrapper for all browsers without using cookies or flash. Uses localStorage, globalStorage, and userData behavior under the hood.
  • localForage - Offline storage, improved. Wraps IndexedDB, WebSQL, or localStorage using a simple but powerful API.
  • jStorage - jStorage is a simple key/value database to store data on browser side.
  • cross-storage - Cross domain local storage, with permissions.
  • basket.js - A script and resource loader for caching & loading scripts with localStorage.
  • bag.js - A caching script and resource loader, similar to basket.js, but with additional k/v interface and localStorage / websql / indexedDB support.
  • basil.js - The missing Javascript smart persistent layer.
  • jquery-cookie - A simple, lightweight jQuery plugin for reading, writing and deleting cookies.
  • js-cookie - A simple, lightweight JavaScript API for handling browser cookies
  • Cookies - JavaScript Client-Side Cookie Manipulation Library.
  • DB.js - Promise based IndexDB Wrapper library
  • lawnchair.js - Simple client-side JSON storage.
  • sql.js - SQLite compiled to JavaScript through Emscripten.

Color

  • randomColor - A color generator for JavaScript.
  • chroma.js - JavaScript library for all kinds of color manipulations.
  • color - JavaScript color conversion and manipulation library.
  • colors - Smarter defaults for colors on the web.
  • PleaseJS - JavaScript Library for creating random pleasing colors and color schemes.
  • TinyColor - Fast, small color manipulation and conversion for JavaScript.
  • Vibrant.js - Extract prominent colors from an image.

I18n And L10n

Localization (l10n) and internationalization (i18n) JavaScript libraries.
  • i18next - internationalisation (i18n) with javascript the easy way.
  • polyglot - tiny i18n helper library.
  • babelfish - i18n with human friendly API and built in plurals support.

Class

  • ClassManager - One of the fastest and most convenient class systems in the world
  • klass - A utility for creating expressive classes in JavaScript.
  • augment - The world's smallest and fastest classical JavaScript inheritance pattern.

Control Flow

  • async - Async utilities for node and the browser.
  • q - A tool for making and composing asynchronous promises in JavaScript.
  • step - An async control-flow library that makes stepping through logic easy.
  • contra - Asynchronous flow control with a functional taste to it.
  • Bluebird - fully featured promise library with focus on innovative features and performance.
  • when - A solid, fast Promises/A+ and when() implementation, plus other async goodies.
  • ObjectEventTarget - Provide a prototype that add support to event listeners (with same behavior of EventTarget from DOMElements available on browsers).

Routing

  • director - A tiny and isomorphic URL router for JavaScript.
  • page.js - Micro client-side router inspired by the Express router (~1200 bytes).
  • pathjs - Simple, lightweight routing for web browsers.
  • crossroads - JavaScript Routes.
  • davis.js - RESTful degradable JavaScript routing using pushState.

Security

  • DOMPurify - A DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG.
  • js-xss - Sanitize untrusted HTML (to prevent XSS) with a configuration specified by a Whitelist.
  • xss-filters - Secure XSS Filters by Yahoo

Log

  • log - Console.log with style.
  • Conzole - A debug panel built in javascript that wraps javascript native console object methods and functionality in a panel displayed inside the page.
  • console.log-wrapper - Log to the console in any browser with clarity.
  • loglevel - Minimal lightweight logging for JavaScript, adding reliable log level methods to wrap any available console.log methods.
  • minilog – Lightweight client & server-side logging with Stream-API backends
  • storyboard - Universal logging library + Chrome extension; it lets you see all client and server tasks triggered by a user action in a single place.

RegExp

  • RegEx101 - Online regex tester and debugger for JavaScript. Also supports Python, PHP and PCRE.
  • RegExr - HTML/JS based tool for creating, testing, and learning about Regular Expressions.
  • RegExpBuilder - Create regular expressions using chained methods.

Voice Command

  • annyang - A JavaScript library for adding voice commands to your site, using speech recognition.
  • voix.js - A JavaScript library to add voice commands to your sites, apps or games.

API

  • bottleneck - A powerful rate limiter that makes throttling easy.
  • oauth-signature-js - JavaScript OAuth 1.0a signature generator for node and the browser.
  • amygdala - RESTful HTTP client for JavaScript powered web applications.
  • jquery.rest - A jQuery plugin for easy consumption of RESTful APIs.

Streaming

  • Tailor - Streaming layout service for front-end microservices, inspired by Facebook's BigPipe.

Vision Detection

  • tracking.js - A modern approach for Computer Vision on the web.
  • ocrad.js - OCR in Javascript via Emscripten.

Machine Learning

  • ConvNetJS - Deep Learning in Javascript. Train Convolutional Neural Networks (or ordinary ones) in your browser.
  • DN2A - Digital Neural Networks Architecture.
  • Brain.js - Neural networks in JavaScript.
  • Mind.js - A flexible neural network library.
  • Synaptic.js - Architecture-free neural network library for node.js and the browser.

Browser Detection

  • bowser - a browser detector

Benchmark

  • benchmark.js - A benchmarking library. As used on jsPerf.com.
  • matcha - A caffeine driven, simplistic approach to benchmarking.

Code highlighting

  • Highlight.js - Javascript syntax highlighter.
  • PrismJS - Lightweight, robust, elegant syntax highlighting.

Loading Status

Libraries for indicate load status.
  • Mprogress.js - Create Google Material Design progress linear bars.
  • NProgress - Slim progress bars for Ajax'y applications.
  • Spin.js - A spinning activity indicator.
  • progress.js - Create and manage progress bar for every objects on the page.
  • progressbar.js - Beautiful and responsive progress bars with animated SVG paths.
  • pace - Automatically add a progress bar to your site.
  • topbar - Tiny & beautiful site-wide progress indicator.
  • nanobar - Very lightweight progress bars. No jQuery.
  • PageLoadingEffects - Modern ways of revealing new content using SVG animations.
  • SpinKit - A collection of loading indicators animated with CSS.
  • Ladda - Buttons with built-in loading indicators.
  • css-loaders - A collection of loading spinners animated with CSS.
  • css-loaders - A collection of loading spinners animated with CSS
Besides libraries, there're Collection on Codepen, and generators like AjaxloadPreloaders and CSSLoad.

Validation

  • Parsley.js - Validate your forms, frontend, without writing a single line of javascript.
  • jquery-validation - jQuery Validation Plugin.
  • validator.js - String validation and sanitization.
  • validate.js - Lightweight JavaScript form validation library inspired by CodeIgniter.
  • validatr - Cross Browser HTML5 Form Validation.
  • FormValidation - The best jQuery plugin to validate form fields. Formerly BootstrapValidator.
  • is.js - Check types, regexps, presence, time and more.
  • FieldVal - multipurpose validation library. Supports both sync and async validation.

Keyboard Wrappers

  • mousetrap - Simple library for handling keyboard shortcuts in Javascript.
  • keymaster - A simple micro-library for defining and dispatching keyboard shortcuts.
  • Keypress - A keyboard input capturing utility in which any key can be a modifier key.
  • KeyboardJS - A JavaScript library for binding keyboard combos without the pain of key codes and key combo conflicts.
  • jquery.hotkeys - jQuery Hotkeys lets you watch for keyboard events anywhere in your code supporting almost any key combination.
  • jwerty - Awesome handling of keyboard events.

Tours And Guides

  • intro.js - A better way for new feature introduction and step-by-step users guide for your website and project.
  • shepherd - Guide your users through a tour of your app.
  • bootstrap-tour - Quick and easy product tours with Twitter Bootstrap Popovers.
  • tourist - Simple, flexible tours for your app.
  • chardin.js - Simple overlay instructions for your apps.
  • pageguide - An interactive guide for web page elements using jQuery and CSS3.
  • hopscotch - A framework to make it easy for developers to add product tours to their pages.
  • joyride - jQuery feature tour plugin.
  • focusable - Set a spotlight focus on DOM element adding a overlay layer to the rest of the page.

Notifications

  • messenger - Growl-style alerts and messages for your app.
  • noty - jQuery notification plugin.
  • pnotify - JavaScript notifications for Bootstrap, jQuery UI, and the Web Notifications Draft.
  • toastr - Simple javascript toast notifications.
  • humane-js - A simple, modern, browser notification system.
  • smoke.js - Framework-agnostic styled alert system for javascript.

Sliders

  • Swiper - Mobile touch slider and framework with hardware accelerated transitions.
  • slick - The last carousel you'll ever need.
  • slidesJs - Is a ressponsive slideshow plug-in for JQuery(1.7.1+) with features like touch and CSS3 transitions
  • FlexSlider - An awesome, fully responsive jQuery slider plugin.
  • unslider - The simplest jQuery slider there is.
  • sly - JavaScript library for one-directional scrolling with item based navigation support.
  • vegas - A jQuery plugin to add beautiful fullscreen backgrounds to your webpages. It even allows Slideshows.
  • Sequence - CSS animation framework for creating responsive sliders, presentations, banners, and other step-based applications.
  • reveal.js - A framework for easily creating beautiful presentations using HTML.
  • impress.js - It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.
  • bespoke.js - DIY Presentation Micro-Framework
  • Strut - Strut - An Impress.js and Bespoke.js Presentation Editor
  • PhotoSwipe - JavaScript image gallery for mobile and desktop, modular, framework independent.
  • jcSlider - A responsive slider jQuery plugin with CSS animations.
  • basic-jquery-slider - Simple to use, simple to theme, simple to customise.
  • jQuery.adaptive-slider - A jQuery plugin for a slider with adaptive colored figcaption and navigation.
  • slidr - add some slide effects.
  • Flickity - Touch, responsive, flickable galleries.
  • Glide.js - Responsive and touch-friendly jQuery slider. It's simple, lightweight and fast. 
  • jQuery.adaptive-slider - A jQuery plugin for a slider with adaptive colored figcaption and navigation.

Range Sliders

  • Ion.RangeSlider - Powerful and easily customizable range slider with many options and skin support.
  • jQRangeSlider - A javascript slider selector that supports dates.
  • noUiSlider - A lightweight, highly customizable range slider without bloat.
  • rangeslider.js - HTML5 input range slider element polyfill.

Form Widgets

Input

  • typeahead.js - A fast and fully-featured autocomplete library.
  • tag-it - A jQuery UI plugin to handle multi-tag fields as well as tag suggestions/autocomplete.
  • At.js - Add Github like mentions autocomplete to your application.
  • Placeholders.js - A JavaScript polyfill for the HTML5 placeholder attribute.
  • fancyInput - Makes typing in input fields fun with CSS3 effects.
  • jQuery-Tags-Input - Magically convert a simple text input into a cool tag list with this jQuery plugin.
  • vanilla-masker - A pure javascript mask input.
  • Ion.CheckRadio - jQuery plugin for styling checkboxes and radio-buttons. With skin support.
  • awesomplete - Ultra lightweight, usable, beautiful autocomplete with zero dependencies. - http://leaverou.github.io/awesomplete/

Calendar

  • pickadate.js - The mobile-friendly, responsive, and lightweight jQuery date & time input picker.
  • bootstrap-datepicker - A datepicker for @twitter bootstrap forked from Stefan Petre's (of eyecon.ro), improvements by @eternicode.
  • Pikaday - A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.
  • fullcalendar - Full-sized drag & drop event calendar (jQuery plugin).
  • rome - A customizable date (and time) picker. Dependency free, opt-in UI.
  • datedropper - datedropper is a jQuery plugin that provides a quick and easy way to manage dates for input fields.

Select

  • selectize.js - Selectize is the hybrid of a textbox and select box. It's jQuery based and it has autocomplete and native-feeling keyboard navigation; useful for tagging, contact lists, etc.
  • select2 - a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.
  • chosen - A library for making long, unwieldy select boxes more friendly.

File Uploader

  • jQuery-File-Upload - File Upload widget with multiple file selection, drag&drop support, progress bar, validation and preview images, audio and video for jQuery.
  • dropzone - Dropzone is an easy to use drag'n'drop library. It supports image previews and shows nice progress bars.
  • flow.js - A JavaScript library providing multiple simultaneous, stable, fault-tolerant and resumable/restartable file uploads via the HTML5 File API.
  • fine-uploader - Multiple file upload plugin with progress-bar, drag-and-drop, direct-to-S3 uploading.
  • FileAPI - A set of javascript tools for working with files. Multiupload, drag'n'drop and chunked file upload. Images: crop, resize and auto orientation by EXIF.
  • plupload - A JavaScript API for dealing with file uploads it supports features like multiple file selection, file type filtering, request chunking, client side image scaling and it uses different runtimes to achieve this such as HTML 5, Silverlight and Flash.

Other

  • form - jQuery Form Plugin.
  • Garlic.js - Automatically persist your forms' text and select field values locally, until the form is submitted.
  • Countable - A JavaScript function to add live paragraph-, word- and character-counting to an HTML element.
  • card - Make your credit card form better in one line of code.
  • stretchy - Form element autosizing, the way it should be.

Tips

  • tipsy - Facebook-style tooltips plugin for jQuery.
  • opentip - An open source javascript tooltip based on the prototype framework.
  • qTip2 - Pretty powerful tooltips.
  • tooltipster - A jQuery tooltip plugin.
  • simptip - A simple CSS tooltip made with Sass.
  • jquery-popup-overlay - jQuery plugin for responsive and accessible modal windows and tooltips.
  • toolbar - A tooltip style toolbar jQuery plugin
  • hint.css - A tooltip library in CSS for your lovely websites.

Modals and Popups

  • Magnific-Popup - Light and responsive lightbox script with focus on performance.
  • jquery-popbox - jQuery PopBox UI Element.
  • jquery.avgrund.js - A jQuery plugin with new modal concept for popups.
  • vex - A modern dialog library which is highly configurable and easy to style.
  • bootstrap-modal - Extends the default Bootstrap Modal class. Responsive, stackable, ajax and more.
  • css-modal - A modal built out of pure CSS.
  • jquery-popup-overlay - jQuery plugin for responsive and accessible modal windows and tooltips.
  • SweetAlert - An awesome replacement for JavaScript's alert.
  • baguetteBox.js - Simple and easy to use lightbox script written in pure JavaScript.
  • colorbox - A light-weight, customizable lightbox plugin for jQuery.
  • fancyBox - A tool that offers a nice and elegant way to add zooming functionality for images, html content and multi-media on your webpages.
  • swipebox - A touchable jQuery lightbox
  • jBox - jBox is a powerful and flexible jQuery plugin, taking care of all your popup windows, tooltips, notices and more.

Scroll

  • scrollMonitor - A simple and fast API to monitor elements as you scroll.
  • headroom - Give your pages some headroom. Hide your header until you need it.
  • onepage-scroll - Create an Apple-like one page scroller website (iPhone 5S website) with One Page Scroll plugin.
  • iscroll - iScroll is a high performance, small footprint, dependency free, multi-platform javascript scroller.
  • skrollr - Stand-alone parallax scrolling library for mobile (Android + iOS) and desktop. No jQuery.
  • parallax - Parallax Engine that reacts to the orientation of a smart device.
  • stellar.js - Parallax scrolling made easy.
  • plax - jQuery powered parallaxing.
  • jparallax - jQuery plugin for creating interactive parallax effect.
  • fullPage - A simple and easy to use plugin to create fullscreen scrolling websites (also known as single page websites).
  • ScrollMenu - A new interface to replace old boring scrollbar.
  • Clusterize.js - Tiny vanilla JS plugin to display large data sets easily.

Menu

  • jQuery-menu-aim - jQuery plugin to fire events when user's cursor aims at particular dropdown menu items. For making responsive mega dropdowns like Amazon's.
  • jQuery contextMenu - contextMenu manager.
  • Slideout - A responsive touch slideout navigation menu for mobile web apps.
  • Slide and swipe - A sliding swipe menu that works with touchSwipe library.

Table/Grid

  • jTable - A jQuery plugin to create AJAX based CRUD tables.
  • DataTables - (jQuery plug-in) It is a highly flexible tool, based upon the foundations of progressive enhancement, and will add advanced interaction controls to any HTML table.
  • floatThead - (jQuery plug-in) lock any table's header while scrolling within the body. Works on any table and requires no custom html or css.
  • Masonry - A cascading grid layout library.
  • Packery - A grid layout library that uses a bin-packing algorithm. Useable for draggable layouts.
  • Isotope - A filterable, sortable, grid layout library. Can implement Masonry, Packery, and other layouts.
  • flexboxgrid - Grid based on CSS3 flexbox

Frameworks

  • Semantic UI - UI Kit with lots of themes and elements
  • w2ui - A set of jQuery plugins for front-end development of data-driven web applications.
  • fluidity - The worlds smallest fully-responsive css framework
  • Ink - An HTML5/CSS3 framework used at SAPO for fast and efficient website design and prototyping

Boilerplates

  • html5-boilerplate - A professional front-end template for building fast, robust, and adaptable web apps or sites.
  • mobile-boilerplate - A front-end template that helps you build fast, modern mobile web apps.
  • webplate - An awesome front-end framework that lets you stay focused on building your site or app while remaining really easy to use.
  • Cerberus - A few simple, but solid patterns for responsive HTML emails. Even in Outlook.
  • full-page-intro-and-navigation - An intro page with a full width background image, a bold animated menu and an iOS-like blurred effect behind the navigation
  • Fluid-Squares - A fluid grid of square units.
  • Mobile-First-RWD - An example of a mobile-first responsive web design
  • this-is-responsive - This Is Responsive
  • npm run-scripts Task automation with NPM run-scripts.

Gesture

  • hammer.js - A javascript library for multi-touch gestures.
  • touchemulator - Emulate touch input on your desktop.
  • Dragula - Drag and drop so simple it hurts

Maps

  • Leaflet - JavaScript library for mobile-friendly interactive maps.
  • Cesium - Open Source WebGL virtual globe and map engine.
  • gmaps - The easiest way to use Google Maps.
  • polymaps - A free JavaScript library for making dynamic, interactive maps in modern web browsers.
  • kartograph.js - Open source JavaScript renderer for Kartograph SVG maps.
  • mapbox.js - Mapbox JavaScript API, a Leaflet Plugin.
  • jqvmap - jQuery Vector Map Library.
  • OpenLayers3 - A high-performance, feature-packed library for all your mapping needs.

Video/Audio

  • prettyembed.js - Prettier embeds for your YouTubes - with nice options like high-res preview images, advanced customization of embed options, and optional FitVids support.
  • html5media - Enables and tags in all major browsers. https://html5media.info/
  • Play-em JS - Play'em is a javascript component that manages a music/video track queue and plays a sequence of songs by embedding several players in a HTML DIV including Youtube, Soundcloud and Vimeo.
  • polyplayer - Rule YouTube, Soundcloud and Vimeo player with one API
  • flowplayer - The HTML5 video player for the web https://flowplayer.org/
  • mediaelement - HTML5 or player with Flash and Silverlight shims that mimics the HTML5 MediaElement API, enabling a consistent UI in all browsers. http://mediaelementjs.com/
  • SoundJS - A library to make working with audio on the web easier. It provides a consistent API for playing audio in different browsers.
  • video.js - Video.js - open source HTML5 & Flash video player
  • FitVids.js - A lightweight, easy-to-use jQuery plugin for fluid width video embeds.
  • Ion.Sound - Simple sounds on any web page
  • photobooth-js - A widget that allows users to take their avatar pictures on your site
  • clappr - An extensible media player for the web http://clappr.io

Typography

  • FlowType.JS - Web typography at its finest: font-size and line-height based on element width.
  • BigText - jQuery plugin, calculates the font-size and word-spacing needed to match a line of text to a specific width.
  • circletype - A jQuery plugin that lets you curve type on the web
  • slabText - A jQuery plugin for producing big, bold & responsive headlines
  • simple-text-rotator - Add a super simple rotating text to your website with little to no markup
  • novacancy.js - Text Neon Golden effect jQuery plug-in.
  • jquery-responsive-text - Make your text sizing responsive!
  • FitText.js - A jQuery plugin for inflating web type
  • Lettering.js - A lightweight, easy to use Javascript <span> injector for radical Web Typography

Animations

Image Processing

  • lena.js - A Library for image processing with filters and util functions.
  • pica - High quality image resize (with fast Lanczos filter, implemented in pure JS).
  • cropper - A simple jQuery image cropping plugin.

ES6

  • es6features - Overview of ECMAScript 6 features.
  • es6-features - ECMAScript 6: Feature Overview & Comparison.
  • es6-cheatsheet - ES2015 [ES6] cheatsheet containing tips, tricks, best practices and code snippets.
  • ECMAScript 6 compatibility table - Compatibility tables for all ECMAScript 6 features on a variety of environments.
  • Babel (Formerly 6to5) - Turn ES6+ code into vanilla ES5 with no runtime.
  • Traceur compiler - ES6 features > ES5. Includes classes, generators, promises, destructuring patterns, default parameters & more.

SDK

  • javascript-sdk-design - Javascript SDK design guide extracted from work and personal experience
  • Spotify SDK - Entity oriented SDK to work with the Spotify Web API.

Misc

  • echo - Lazy-loading images with data-* attributes.
  • picturefill - A responsive image polyfill for <picture>, srcset, sizes.
  • platform.js - A platform detection library that works on nearly all JavaScript platforms.
  • json3 - A modern JSON implementation compatible with nearly all JavaScript platforms.
  • Logical Or Not - A game about JavaScript specificities.
  • BitSet.js - A JavaScript Bit-Vector implementation
  • spoiler-alert - SPOILER ALERT! A happy little jquery plugin to hide spoilers on your site.
  • jquery.vibrate.js - Vibration API Wrappers
  • list.js - Adds search, sort, filters and flexibility to tables, lists and various HTML elements. Built to be invisible and work on existing HTML. http://www.listjs.com
  • mixitup - MixItUp - A Filter & Sort Plugin
  • grid - Drag and drop library for two-dimensional, resizable and responsive lists.
  • jquery-match-height - a responsive equal heights plugin for jQuery.

Podcasts

  • JavaScript Air - The live video broadcast podcast all about JavaScript and the Web platform.
  • Web of Tomorrow - Podcast about JavaScript for beginners.
  • Javascript Jabber - A weekly podcast about JavaScript, including Node.js, Front-End Technologies, Careers, Teams and more. 

Worth Reading

Other Awesome Lists

from https://github.com/sorrycc/awesome-javascript
-----------------

from http://hao.jobbole.com/?catid=67
-------------------

A learning guide for JavaScript programmers.


Table of Contents

Awesome JavaScript

JavaScript是一个仅在一周就被发明出来的小玩意, 所以,它有着有多的缺陷,即使是这样,它已经存在了20年,全世界几乎每台电脑都至少装有一个JavaScript解释器, 况且今天这个当初的小玩意的目标是编写大型的企业应用。如果你对JavaScript的理解仅限于DOM操纵,页面动画,jQuery等等, 本列表将为你展现JavaScript的更多的令人震撼的功能。

专题列表

基础

开发准备

  1. 安装 Node.js
  2. 安装 PhantomJS - 没有界面的浏览器
  3. 安装 Python27 (Node有些模块对Python有依赖)
  4. 安装 Git
  5. 编辑器 WebStormVisual Studio Code

推荐的书

源代码阅读

敏捷方法与工具

  1. 持续集成与部署
  2. 敏捷相关的几个概念
    • Scrum: Scrum Guide
    • TDD: Test-Driven Development by Example (book)
    • Pair Programming

Web安全

  1. 跨站脚本攻击 - XSS
  2. 跨站请求伪造 - CSRF
  3. SQL注入
  4. 拒绝服务 - DDoS
  5. An Introduction to Content Security Policy
  6. More: Web Application Security Testing Cheat Sheet

JavaScript

核心基础语法点
核心概念
  1. Functional Programming 函数式编程
  2. Prototyped-based OOP 基于原型的面向对象编程
  3. Async/Concurrent Programming 异步/并发编程
关键知识点
Other topics
  1. 日期和时间字符串
  2. 处理Cookies
  3. Promise
  4. JavaScript与有限状态机
  5. Fetch API
  6. 什么是shims和polyfills
  7. 严格模式
  8. ES5增加的新特性
  9. ES6基本介绍
  10. JavaScript的模块化进程
  11. Command Line API参考手册

ECMAScript 2015 (ES6)

阅读材料
  1. Understanding ES6 by Nicholas C.Zakas
  2. Exploring ES6 by Axel Rauschmayer
语法转换 ES6 to ES5
  1. Babel - 推荐!杀手级特性"human-readable output"
  2. Traceur
  3. Babelify: 将babel引入到Gulp, Grunt, npm run等构建过程
  4. A Brief History of ES6 Tooling
入门
  1. Learn ES2015
  2. ES6 - New features Overview & Comparison
  3. ES6 Overview in 350 Bullet Points
  4. 百度EFE:使用ES6进行开发的思考
  5. ES6 Features
其他
  1. ES5/ES6 compatibility table
  2. ES6 Cheatsheet

Node.js

图书

  1. Node.js In Action
  2. 深入浅出Node.js

开发实践

基础知识
  1. NODE_PATH
垃圾回收
  1. A tour of V8: Garbage Collection | CHN
  2. Top Node.js metrics to watch
  3. Goole V8的垃圾回收
  4. 浅谈V8引擎中的垃圾回首机制
性能对比
  1. Performance Comparison Between Node.js and Java EE
  2. Java EE threads vs Node.js - which is better for concurrent data processing operations
  3. What Makes Node.js Faster Than Java

最佳实践

  1. Node.js最佳实践:第一部分
  2. Node.js最佳实践:第二部分

风格指南

  1. Node.js风格指南(中文)

常用的Node Web框架

  1. 传统的Node框架:Express
  2. 下一代Node.js框架:Koa
  3. 专注于构建可重用的应用逻辑:Hapi
  4. 其他Node框架

常用NPM工具模块

感兴趣的可以参考NPM中被依赖次数最多的模块列表
  1. JS工具函数库:lodash
  2. JavaScript编写同步代码辅助工具包:async
  3. 精简版HTTP请求客户端:request
  4. 配置管理工具包:nconf
  5. 基于生成器的控制流管理工具包:co
  6. 轻量级模块调试工具:debug
  7. 构建请求: superagent
  8. 辅助测试工具:Sinon.js

调试、性能与安全

  1. Node.js的代码调试和性能调优
  2. Node.js安全清单
  3. Debug with Source Maps
  4. 雅虎: 网站性能优化建议

开发工具和库

对于前端开发而言,如果你需要查找一些库或框架来帮你解决问题, 下面两个网站可能会帮助你选择:
  1. JavaScripting.com
  2. JavaScriptOO
借助上面的两个网站,你能够迅速的找到相关的工具。你还可以参考这篇文章来了解JavaScript必备的工具和库。 下面会继续列举一些常用的工具、库、或框架:
  1. 版本控制
  2. 自动构建
  3. 代码质量
  4. 前端工具
  5. 文档生成
  6. 工具库
  7. UI框架
  8. 前端框架
  9. 可视化库
  10. 模块系统和包管理器
  11. 单元测试
  12. 代码衡量
    High code coverage means lower chances for your program to contains bugs.
  13. 实时应用
  14. 单页应用SAP
  15. 函数式JavaScript
  16. 模版引擎
  17. 前端资源CDN服务:

Future

很遗憾,这里只能列举一些常用的资料,但幸运的是,互联网极大便利了我们获取信息的方式, 下面几个链接或许是你正在寻找的:
  1. Frontend Rescue - 帮助你获取前端资源
  2. JSbooks - 帮助你寻找和JS相关的书
  3. Cooper Press 订阅

Other links

  1. JavaScript Training Sucks
  2. The Two Pillars of JavaScript: part one - how to escape the 7th circle of hell

awesome-javascript-editors

A collection of awesome javascript editors
具备粗体、斜体、列表、图片、引用、段落、分段等功能,并能产出优美的html代码。
区别于传统的富文本编辑器,只生产纯净的 html tags,不添加额外的 style 属性。
或者其实可以叫做所见即得的 html 编辑器。
Quote from http://www.theguardian.com/info/developer-blog/2014/mar/20/inside-the-guardians-cms-meet-scribe-an-extensible-rich-text-editor:
What we needed was a library that only patched browser inconsistencies in contentEditable and, on top of that, ensured semantic markup — a very thin layer on top of contentEditable. That’s why we built Scribe.
参考
div contenteditable

框架

更多 »
  • jQWidgets

    jQuery HTML5 UI组件框架
  • Bootstrap

    Bootstrap:Web前端开发框架
  • TodoMVC

    帮助你选择一个MV*框架
  • Riot.js

    不到1kb的客户端Model-View-Presenter(MVP)框架
  • jQuery 

    一个快速、体积小、功能丰富的Javascript库
  • Aura

    一个事件驱动、可扩展的JS架构

小工具

更多 »
  • BEM

    BEM:前端命名方法论
  • Gmail.js

    Gmail的Javascript API(非官方)
  • SourceMaps

    SourceMaps:映射压缩和源文件
  • JSLinux

    Javascript 编写的 x86 模拟器
  • JuliusJS

    一个语言识别的 JavaScript 库
  • Node JVM


工作流

更多 »
  • Yeoman

    强大的web构建工具
  • Brunch

    超快的HTML5构建工具
  • Helium

    检查网站中未使用的CSS
  • Grunt

    基于任务的Javascript项目构建工具

打包管理

更多 »

学习指南

更多 »

架构

更多 »

可视化

更多 »

图像操作

更多 »

聊天

更多 »

动画

更多 »

测试

更多 »
  • Karma

    Google开源的JavaScript测试执行过程管理工具
  • Modernizr

    检测用户浏览器HTML5和CSS3特性的JavaScript库

富文本编辑器

更多 »

HTTP

更多 »

MVC框架和库

更多 »
  • AngularJS

    功能齐全且强大的前端MVC框架
  • way.js

    轻量级、持久化的双向绑定JS库

函数式编程

更多 »

图片处理

更多 »
  • pica

    使用JS进行快速高品质图像缩放
  • lena.js

    拥有滤镜和实用功能的图像处理库

字体与排版

更多 »

代码查看和编辑器

更多 »
  • JSLint

    JS代码质量检测工具

性能

更多 »

错误处理与调试

更多 »

幻灯片

更多 »
  • impress.js

    一个非常棒的用来创建在线演示的Javascript库

安全

更多 »
  • SJCL

    斯坦福大学JS加密库

路由

更多 »

验证

更多 »
  • is.js

    检查类型、正则表达式、是否存在、时间等

视频/音频

更多 »
  • html5media

    兼容、高效的HTML5视频播放器

大杂烩

更多 »
  • JSON3

    一个现代JSON实现库