作為WEB前端開發，大家都知道那些方便的js擴展庫呢？

01-02

如果有了現成輪子，也就沒有必要自己在去造了，這樣省時省力。那些成熟的框架，都經過了嚴格的測試，BUG也相對的少很多。

我就安利一個最近用過的特別好用的工具。

字蛛（FontSpider）

想要在網頁里添加特殊的中文字體怎麼辦？中文字體文件動不動就幾兆大，你不可能直接引入。有了字蜘你只需要：

npm install font-spider -g

然後創建一個html文件

& @font-face { font-family: "source"; src: url("../font/source.eot"); src: url("../font/source.eot?#font-spider") format("embedded-opentype"), url("../font/source.woff2") format("woff2"), url("../font/source.woff") format("woff"), url("../font/source.ttf") format("truetype"), url("../font/source.svg") format("svg"); font-weight: normal; font-style: normal; }

* { font-family: "source"; } & & 在這裡寫上你頁面里要用的中文。 &

然後

font-spider *.html

等待命令行提示，你需要的字體文件就生成完了，一般就幾十k到幾百k大而已。

【導讀】：GitHub 上有一個 Awesome – XXX 系列的資源整理。awesome-javascript 是 sorrycc 發起維護的 JS 資源列表，內容包括：包管理器、載入器、測試框架、運行器、QA、MVC框架和庫、模板引擎、數據可視化、時間軸、編輯器等等。

伯樂在線已在 GitHub 上發起「JavaScript 資源大全中文版」的整理。歡迎擴散、歡迎加入。

GitHub - jobbole/awesome-javascript-cn: JavaScript 資源大全中文版，內容包括：包管理器、載入器、測試框架、運行器、QA、MVC框架和庫、模板引擎等

js包下載地址：javascrip框架大集合

包管理器

管理著 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 式斷言工具。

覆蓋率

?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 和瀏覽器。

文章和帖子

?The JavaScript that you should know – 關於 JavaScript 函數化概念的文章。

數據可視化

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 遊戲的框架。

也有一些很棒的收費庫，如 amchart、plotly 和 highchart。

時間軸

?TimelineJS – 一個用 JavaScript 編寫的可敘事時間軸庫。

?timesheet.js – 用於構建簡單的 HTML5 CSS3 時間表的 JavaScript 庫。

編輯器

?ace – Ace（http://Ajax.org Cloud9 Editor）。

?CodeMirror – 瀏覽器端的代碼編輯器。

?esprima – 用於綜合分析的 ECMAScript 解析器。

?quill – 一個帶有 API 的跨瀏覽器富文本編輯器。

?medium-editor – http://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 路由器。

安全性

?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 – 一個瀏覽器檢測器。

代碼高亮

?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 的，另外還有 Ajaxload，Preloaders 和 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 插件。

模態框和彈出框（Modals and Popups）

?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 – 能在所有主流瀏覽器播放多媒體標籤中定義的多媒體文件。HTML5 video and audio tags in all major browsers

?Play-em JS – Play』em 是一個 JavaScript 組件，它能管理音樂/視頻播放順序，通過在一個 DIV 元素里嵌入幾個播放器（Youtube、Soundcloud 和 Vimeo）來控制一系列歌曲的播放。

?polyplayer – 將 YouTube、Soundcloud 和 Vimeo 播放器的 API 統一成一套。

?flowplayer – HTML5 視頻播放器 Flowplayer

?mediaelement – 讓 HTML5、 Flash 播放器和模仿 HTML5 媒介元素 API 的 Silverlight shim，在所有瀏覽器擁有一致的 UI。MediaElement.js

?SoundJS – 讓音頻在 web 上運行更簡單的庫。它為不同瀏覽器提供了一致的 API。

動畫

?velocity – 加速 JavaScript 動畫。

?jquery.transit – 擁有超級流暢的 CSS3 變換和過渡的 jQuery 插件。

?impess.js – 在 HTML 文檔里，運用 CSS3 變換和過渡製作類似 Prezi 的展現效果。

?bounce.js – 可以立刻創建有趣的 CSS3 動畫。

?GreenSock-JS – 適用於所有主流瀏覽器的高性能 HTML5 動畫。

?TransitionEnd – TransitionEnd 是一個運用 transitonend 事件的、跨瀏覽器的庫。

?Dynamic.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 等。

軟體開發工具包

?javascript-sdk-design – 從工作和個人經驗中提煉出來的 JavaScript SDK 設計指導。

大雜燴

?echo – 利用 data-* 屬性延遲載入圖片。

?picturefill – 響應式圖片顯示插件，使瀏覽器支持 srcset、size 屬性。

?platform.js – 一個平台檢測庫，幾乎適用於所有 JavaScript 平台。

?json3 – 一個現代 JSON 實現庫，幾乎兼容所有 JavaScript 平台。

?Logical Or Not – 一個關於 JavaScript 特性的遊戲。

?BitSet.js – 實現位向量的 JavaScript 庫。

時髦的virtualdom

Mithril

react之前的virtualdom庫

virtualdom當然不是react發明的