15個(gè)可提升編碼技能的JavaScript工具
本文中我們整理了 15 個(gè)JavaScript工具,來(lái)幫助你提高編碼技能,更快、更輕松地完成工作。以下JavaScript工具可以幫助你管理Javascript狀態(tài),壓 縮你的javascript代碼,重構(gòu)script代碼結(jié)構(gòu),等等。我們希望這個(gè)工具列表方便而有用。如果你了解其他的javascript工具,請(qǐng)?jiān)谠u(píng) 論中提出,我們期待你的建議。閱讀愉快!
1. JavaScript 狀態(tài)管理器
Simple State Manager(SSM) 是一個(gè)為響應(yīng)式網(wǎng)站設(shè)計(jì)的,輕量級(jí)而易用的JavaScript狀態(tài)管理器。它不依賴(lài)任何JavaScript框架,是能讓頁(yè)面布局代碼更整潔的良伴。你 可以設(shè)置斷點(diǎn),然后打包全部的JavaScript從這個(gè)斷點(diǎn)開(kāi)始執(zhí)行。一旦遇到了下一個(gè)斷點(diǎn),SSM會(huì)禁用之前的狀態(tài)代碼,觸發(fā)執(zhí)行新的狀態(tài)代碼(所以 你不用手動(dòng)切換)。這個(gè)管理器有完整的API,debugger和用于后續(xù)擴(kuò)展的插件支持。
2. jsMini
如果你想快速而方便地壓縮你的JavaScript或jQuery文件,用jsMini吧。只需復(fù)制粘貼你的源代碼,選擇基本壓縮或是完全壓縮,就能得到壓縮好的代碼。
3. CountUp.js
CountUp.js 是一個(gè)無(wú)依賴(lài),輕量級(jí)的JavaScript“類(lèi)”,用來(lái)快速創(chuàng)建有趣的數(shù)字顯示動(dòng)畫(huà)。盡管叫這個(gè)名字,countUp可以正數(shù)也可以倒數(shù),取決于你傳入 的 startVal 和 endVal 參數(shù)。包括Bower和Component .json文件,并有coffeescript版本。
4. Grasp
Grasp幫助你基于代碼結(jié)構(gòu)來(lái)查找、替換和重構(gòu)JavaScript代碼。它比普通的查找替換更為強(qiáng)大,讓重構(gòu)更方便,并且允許你執(zhí)行一行的基本宏。
5. Gulp.js
Gulp.js 是一款流式(streaming)項(xiàng)目build系統(tǒng)。它使用node.js的stream,主張代碼優(yōu)先于配置,因此使build流程更簡(jiǎn)單、直觀。因?yàn)樗源a而不是配置為中心,gulp得以化繁為簡(jiǎn),同時(shí)簡(jiǎn)單的工作仍然簡(jiǎn)單。
#p#
6. Orcrad.js
Ocrad.js是一個(gè)簡(jiǎn)單的OCR程序,可以識(shí)別圖片中的文字。它是Ocrad項(xiàng)目的純JavaScript版,總體大約1MB,不依賴(lài)大規(guī)模訓(xùn)練。
7. Headroom.js
Headroom.js是一個(gè)輕量級(jí),高性能的JS widget (不依賴(lài)任何框架!) 幫你響應(yīng)用戶對(duì)頁(yè)面的滾動(dòng)。向下滾動(dòng)時(shí),header滑出界面;向上滾動(dòng)時(shí),header滑入回來(lái)。Headroom.js幫助你在恰當(dāng)?shù)臅r(shí)間將元素帶入 界面,其他時(shí)間讓用戶的注意力集中在頁(yè)面內(nèi)容上。應(yīng)用headroom.js真的很簡(jiǎn)單。它有純JS的API,以及可選的兼容jQuery/Zepto和 AngularJS的插件.
8. Jiko
Jiko 是一個(gè)先進(jìn)和易于使用的JavaScript的模板引擎。它的目的是為JavaScript程序員提供一種能夠使用和服務(wù)端的藝術(shù)模板引擎(如Jinja 和 Mako)一樣強(qiáng)大的引擎來(lái)編寫(xiě)JS模板的途徑。
9. FileAPI
FileAPI 是一個(gè)龐大的幾乎任何與文件有關(guān)的JavaScript工具的集合。它提供了單個(gè)/多重文件上傳的很多功能:支持拖放,圖像裁剪、縮放,應(yīng)用過(guò)濾器,獲取 文件信息和其它一些功能。該工具是獨(dú)立的,帶有一個(gè)在服務(wù)器端實(shí)現(xiàn)處理行為的PHP類(lèi)。同時(shí),對(duì)于不支持(上傳和相機(jī))的瀏覽器可以快速回退。而且它有詳 細(xì)的文檔。
10. Object Playground
Object Playground 是一個(gè)能使JavaScript對(duì)象可視化和被實(shí)驗(yàn)的工具。它就在你的瀏覽器中運(yùn)行,使用很方便。
#p#
11. Echo.js
Echo 是一個(gè)獨(dú)立的JavaScript圖像延遲加載工具。Echo 運(yùn)行很快,使用HTML5的 data-* 屬性。它不支持IE8以下版本。echo.js使圖像延遲加載變得很簡(jiǎn)單,而且壓縮代碼之后只有不到1KB,而且不依賴(lài)于jQuery/Zepto或其他 JS庫(kù)。
延遲加載是只當(dāng)目標(biāo)元素要顯示在視圖中時(shí)才加載其所需資源。它只是通過(guò)簡(jiǎn)單地改變圖像的src屬性就可以自動(dòng)向服務(wù)器發(fā)起請(qǐng)求并得到該資源。這也是一個(gè)異步過(guò)程,有利于加載和瀏覽。
12. jsComplexity
想知道你的JavaScript代碼有多復(fù)雜么?用Analysis運(yùn)行自己看看吧。代碼中復(fù)雜性存在的越多,出bug的機(jī)會(huì)越多,所以你所能做的就是簡(jiǎn)化代碼來(lái)提升性能及可靠性。
13. Chance.js
Chance是一個(gè)隨機(jī)字符串、數(shù)字等的簡(jiǎn)約生成器,它能夠幫助減少在編寫(xiě)自動(dòng)化測(cè)試或其他任何需要隨機(jī)場(chǎng)景時(shí)的單一性。Chance是個(gè)開(kāi)源軟件,在開(kāi)發(fā)及商用均友好的MIT許可下發(fā)布。Chance在本網(wǎng)站上已加載,你可以打開(kāi)你瀏覽器console試一下!
14. Bookmarkfiy
Bookmarkify 可以使你創(chuàng)建自己的書(shū)簽?zāi)_本工具變得非常簡(jiǎn)單。只要命名你的書(shū)簽?zāi)_本,然后輸入它對(duì)應(yīng)的要執(zhí)行的代碼,執(zhí)行功能按鈕,把結(jié)果收藏到書(shū)簽中就可以了。(譯者 感覺(jué)對(duì)于一般比較簡(jiǎn)單的書(shū)簽?zāi)_本來(lái)說(shuō)完全是畫(huà)蛇添足,對(duì)于某些特殊和代碼量較大的腳本可以考慮)
15. David
David 是一個(gè)讓你能得到節(jié)點(diǎn)依賴(lài)概觀的工具。它為每一個(gè)依賴(lài)的現(xiàn)狀創(chuàng)建一個(gè)徽章標(biāo)記來(lái)顯示。你可以選擇把它嵌入在您的網(wǎng)站上。
原文鏈接:http://codegeekz.com/javascript-tools/
譯文鏈接:http://www.oschina.net/translate/javascript-tools-improve-your-coding-skills