[Javascript] 40個輕量級JavaScript腳本庫

諸如jQuery, MooTools, Prototype, Dojo和YUI等JavaScript腳本庫，你們都已經很熟悉。但這些腳本庫有利也有弊——好比說JavaScript文件過大的問題。有時你可能會願意採用一些體積小巧、專一於特定任務的JavaScript腳本庫。

如下是40個輕量級的JavaScript腳本庫。 供每位網頁設計師和程序員做參考。

1. 表單

wForms

wForms 是一個開源的、 無入侵的(unobstrusive)^注*代碼庫，可以簡化大部分與表單相關的經常使用JavaScript函數。 它能對錶單的用戶輸入值進行驗證，只需爲表單元素添加一個特定的類便可使用。另外，wForms 還具備強大的表單同步（例如「全選/全不選」）和條件表單（如，當x被選擇則顯示y）功能。

Validanguage

Validanguage 是一個無入侵的 JavaScript表單驗證框架。 它有一個繼承邏輯，能夠全局定義，也能夠對每一個表單或每一個元素分別定義。 利用做者提供的兩個API，以及諸如綜合的AJAX支持(integrated AJAX support)、緩存和調用函數等特性，該框架能夠提供強健的(robust)驗證體驗。兩個API用以高級設置，分別是加在註釋裏的像HTML語言的 API和基於JavaScript對象的API。

LiveValidation

LiveValidation是一個輕量級的JavaScript腳本庫，提供一系列驗證函數。除了經典驗證法，此庫還具備實時驗證(live validation)特性，能根據你鍵入的文字實時控制特定區域。 Ruby on Rails的開發者會發現LiveValidation異常好用，由於兩者的命名規範和參數設置很是類似。雖然它是獨立庫，不過也有一個Prototype版^注*。

yav

一個功能強大、可擴展、使用靈活的表單驗證代碼庫。yav可處理多種狀況，從日期、email、整數之類的基本驗證到掩碼文本框和自定義正則表達式之類的高級應用，都駕輕就熟。該庫內建AJAX支持，而且能夠輕易在每一個對象層自定義錯誤顯示信息。

qForms

處理表單的徹底解決方案。爲開發者提供諸如多樣驗證規則，阻止屢次提交，鎖定/禁用域等特性。

formreform

不用表格來實現多欄佈局一般都頗有挑戰性。這個小巧的代碼庫可以把一個簡單表單轉換成一欄、兩欄或四欄格式化佈局的表單。利用formreform能自動讓表單樣式適應任何設計。

2. 動畫

$fx()

$fx() 是一個用戶爲HTML元素添加動畫效果的輕量級代碼庫。利用此庫，你能夠指定在必定時間內改變任何CSS屬性。對於複雜動畫，你能夠合併效果，給各效果分組，讓它們鏈式反應或者同時發生。你還能夠爲每一步動畫設定不一樣的回調動做，進行更深刻的自定義。

JSTweener

補間動畫的JavaScript腳本庫。它的API和著名的ActionScript補間動畫引擎 Tweener 類似。你能夠調用動畫時間，定義形狀變換方式和延遲。在幾乎任什麼時候間點（如onStart – 開始時, onComplete -完成時, onUpdate – 更新時），你均可以引起新動做。

Facebook Animation

用於建立基於CSS的自定義動畫的強大代碼庫。利用一兩行Facebook Animation，你就能改善用戶界面。本代碼庫的語法遵循FBJS（在Facebook實用工具中使用的代碼庫），一旦學會，你也就具有了建立Facebook實用工具的能力！

FX

一個輕量級代碼庫，擁有和YUI相似的使用句法。FX能夠爲幾乎全部CSS屬性建立補間動畫。支持顏色和滾動動畫。你只須要設計任意對象，任意屬性的起始值和結束值就夠了。

3. 視覺化和圖像特效

JS charts

JS charts 能夠輸出柱狀圖，餅圖和曲線圖。只需從一個XML文件或JavaScript數組裏調用數據，它就能提供極佳的易用性。圖表被輸出爲png圖像文件。該庫支持大部分流行的瀏覽器。

Canvas 3D JS Library (C3DL)

C3DL讓編寫3D應用更加容易。它提供一組算法、場景和3D對象類，對於想在瀏覽器裏開發3D內容，可是對3D圖像的深層算法不甚了了的程序員真是不小的福音。

Processing.js

這個JavaScript腳本庫指向 Processing 語言 （一個用於圖像、動畫和交互編程的語言）。它有豐富的特性用於建立2D輸出，提供形狀/圖像繪製方法、顏色處理、字體、對象、算法函數等等。

Rapha?l

一個極讚的代碼庫，簡化在網頁中使用矢量圖形的工做。Rapha?l 利用SVG和VML來建立圖像，並能爲這些圖像綁定動做處理器。該庫功能強大，包括旋轉、動畫、縮放和繪製曲線、矩形、圓形等。

ImageFX

能夠爲圖像添加特效，例如模糊、銳化、浮雕、變亮等等。ImageFX使用畫布元素來建立效果。兼容全部主流瀏覽器（你能夠在其頁面看到兼容性列表）。此庫簡單易用，只須要在網頁中插入.js文件而後用一行代碼調用就夠了。

Pixastic

Pixastic 使用HTML5的畫布對象，此對象能夠直接處理像素級數據。支持的效果包括減淡和去色、反相、翻轉、亮度和對比度調節、色相和飽和度、浮雕、模糊等等等等。因爲畫布對象相對較新，各個瀏覽器對這一JavaScript腳本庫的支持程度不盡相同。

Reflection.js

自動建立倒影效果的無侵入JavaScript腳本庫。倒影的高度和透明度能夠自定義。使用該庫就像給圖像添加一個「類」同樣簡單。在全部主流瀏覽器中都能正常工做，文件大小不過5 KB。

4. 數據庫

Taffy DB

能夠做爲瀏覽器中的SQL數據庫來使用的JavaScript，也能夠看作是一個高級的「數組管理器」。在AJAX化的Web應用中，它能夠工做在數據庫層。你能夠建立、讀取、編輯和刪除數據，也可使用循環、歸類以及各類高級查詢方式。

ActiveRecord.js

此庫支持Google Gears和Chrome，Aptana Jaxer，Adobe AIR ，以及任何支持W3C HTML5 SQL規範的平臺（如今Webkit和iPhone也支持了）。它使在JavaScript利用數據庫變得簡單。使用ActiveRecord.js, 你能自動建立數據表、驗證和同步數據等等。

5. 字符串和數學函數

Date.js

和日期打交道老是很容易把人搞昏掉。如此多的點、斜槓和格式。Datejs以使人耳目一新的方式提供或簡單或複雜的日期函數。它能夠處理以下格式的日期：「Next thursday」(下星期四), 「+2 years」(兩年後) 以及諸如2009.01.08, 12/6/2001的全部格式。

Sylvester

此JavaScript腳本庫能夠輕鬆處理矢量和矩陣。有了它你就不用被一串串循環和大量數組攪得頭昏腦脹了。此庫包含模數化矢量和任意維度的矩陣的類，從而能夠計算無限直線的模數和3D空間裏的平面。

Pretty Date

一個聰明的JavaScript解決方案，讓過去一個月內的日期以更加漂亮和用戶友好的方式顯示。它能讓日期以距離如今多久的方式顯示，如「3天之前」，「昨天」。

XRegExp

正則表達式能夠在JavaScript裏經過RegExp對象加以利用。 XRegExp 能使正則表達式變得更增強大，它提供一些在未來的瀏覽器纔會實現的特性（據 ECMAScript 4 – ES4 的開發願景）。使用該庫，RegExp對象能夠被緩存和再利用，還能爲已經存在的RegExp對象添加修改器等等。

JavaScript URL Library

一個用與方便處理URLs的JavaScript腳本庫。若是須要，它能夠控制到將URL內每個部分當作字符串來處理。這一URL代碼庫剛出爐不久，但已能像剛纔所提同樣工做。

6. 字體

typeface.js

一個用以在網頁上使用任意字體的代碼庫。與流行的解決方案（如sIFR 和 FLIR）不一樣，typeface.js 並不須要Flash，是100%的JavaScript應用。要使用任意字體，只需上傳其字體文件到一個 基於網頁的字體生成器，而後下載渲染過的JavaScript文件，把它添加到你的網頁中便可。

Cufón

與typeface.js十分類似， Cufón 也是一個讓你在網頁中使用TrueType字體的代碼庫。一樣，它也使用一個生成器來將字體文件轉換成VML圖像。只需在網頁中插入generated .js文件，你便可像使用普通字體同樣使用你指定的字體。

7. 調試與記錄

Blackbird

在JavaScript開發過程當中，常常會用到alert()函數來添加斷點。Blackbird 提供一個風格化的控制檯，用以記錄、查看和過濾JavaScript中的消息，如此便可消除在每一個alert()的停頓，而且更好地分析它們，從而加快開發進程。

NitobiBug

基於瀏覽器的，跨瀏覽器 JavaScript 對象記錄和檢測組件。經過在你的代碼中插入規則（和JavaScript對象的用法相似），你能夠輕易區別簡單類型，如字符串、布爾值和數值，以及複雜元素，如錯誤信息和JavaScript對象。

Firebug Lite

Firebug，大概是世界上最好的JavaScript調試工具，惋惜只能在Firefox中使用。要在全部瀏覽器中擁有一個相似工具，向你的網頁添加這個Firebug Lite .js文件吧，面對你的是你所熟悉的功能和界面。

8. 其餘

swfobject

swfobject 是最流行的，擴展性最好的插入Flash影片的方式。此庫符合Web標準，生成能夠經過驗證的標記，可以自動檢測用戶的Flash播放器版本，若是版本不匹配，它還容許你向用戶顯示代替內容。你能夠看一看「爲何應該使用swfobject」這篇文章，寫得不錯。

sorttable and dragtable

無論你喜不喜歡，表格仍然是展現數據的最佳方式。不過表格還能夠更好用： sorttable 讓表格數據能夠排序，升序降序都可。你指向爲添加class=」sortable」 屬性。你還能夠排除某些特定的欄，讓他們不自動排序，以及指定升序或者降序哪個爲默認值。dragtable 使表格的行列變得可拖動。在網頁中插入此庫後，一樣，給表格添加一個class=」dragtable」便可。若是須要兩個功能都用，只需在網頁中包含同時兩個庫，而後添加class=」sortable dragtable」 。

DD_roundies and DD_belatedPNG

DD_roundies 是一個極佳的不利用圖片建立圓角的JavaScript解決方案。它處理的重點在IE，經過使用VML來解決問題。其餘瀏覽器被忽略，由於他們支持CSS的 border-radius 屬性。

DD_belatedPNG爲臭名昭著的IE6 PNG問題提供了一個可自定義的解決辦法。不論PNG圖像是用於「src」或是「background-image」中， DD_belatedPNG 都能把它解決掉。與其餘解決方案不一樣， 「background-position」 和 「background-repeat」 屬性也能正常工做！

Custom JavaScript Dialog Boxes

用於建立自定義對話框的輕量級（約 4.5 KB）代碼庫。四種對話框可用： alerts(出錯), warnings(警告), prompts(提示), success(成功)。利用一個簡單的函數，你能夠自定義對話框的標題，內容和顯示時間。

GameJS

GameJS 是一個JavaScript版本的 Microsoft’s XNA 遊戲框架， 使用 「畫布」 做爲渲染機制。JavaScript不是編寫遊戲的最佳平臺。不過若是是那些幀速要求較低的遊戲，而你又是一個JavaScript開發者，何樂而不爲？ 此庫包含一些控制遊戲元素、屏幕顯示和鍵盤操做的方便好用的類。

Shortcuts.js

自從Google Reader和Gmail以後，Web應用裏的鍵盤快捷鍵變得愈來愈流行，由於他們大大提高了易用性。Shorcuts.js提供更爲方便地處理鍵盤快捷鍵的函數。 使用該庫，建立快捷鍵，而後在按下鍵盤的同時就運行函數成爲更易實現的可能。

Mapstraction

幾個不一樣的地圖供應商都提供了各自不一樣的API。若是你想在供應商之間轉換（好比說從Google Map轉到MapQuest），則須要重寫一些代碼。Mapstraction就是用來幫你解決這個問題的。它提供一個通用 API ，幫你在大多數流行的地圖供應商之間轉換。只需更新一行代碼，便可轉換完畢。

Amberjack

一個小巧的JavaScript腳本庫，爲你的網站添加上漂亮的導遊信息。 一旦啓用，一個模式化的內容框就能像到導遊同樣介紹您的站點，框內能夠添加任意你想要的內容。導遊內容的代碼能夠手工編寫，也能夠用線上工具自動生成。固然，你能夠經過編寫css或者利用即刻可用的主題來使導遊信息符合內容框的樣式。

JsLoad

JavaScript腳本庫的遠程載入API。JsLoad這個簡單的API可以讓你從Google的服務器上導入大致積JavaScript文件。JsLoad能自動載入任何版本代碼庫的依賴文件。

英文原文: 40 Useful JavaScript Libraries | Smashing Magazine
中文譯文: 40個實用的輕量級JavaScript庫 | 笨活兒