經常使用前端開發工具合集

經常使用前端開發工具合集

1.Firebug http://getfirebug.com/
最流行的前端開發工具

2.HttpWatch http://www.httpwatch.com/
集成在IE和Firefox上的監聽HTTP和HTTPS的工具

3.Fiddler http://www.fiddler2.com/fiddler2/
Fiddler是一個記錄你電腦和網絡之間全部HTTP(S)請求的網絡調試代理

4.HttpFox https://addons.mozilla.org/eu/firefox/addon/6647?lang=en-US
和HTTPWatch很相似的一個工具

5.Yslow http://developer.yahoo.com/yslow/
Firebug的一個擴展，能夠根據高性能網站的一些準則來分析網頁而且提出建議來提升網站的性能

6.Css Usage https://addons.mozilla.org/zh-CN/firefox/addon/10704
Firebug的一個擴展，能夠用來察看哪些CSS被用到了

7.VIM http://www.vim.org/
一個高級的文本編輯工具，是在UNIX系統上面VI編輯器的升級版本

8.Editplus http://www.editplus.com/
Windows系統上的一個好用的文本編輯器

9.DNS Flusher https://addons.mozilla.org/en-US/firefox/addon/7408
Firefox上的一個附加組件，當HOST文件改變時能夠很快地更新頁面而不須要重啓瀏覽器

10.PageSpeed http://code.google.com/intl/zh-CN/speed/page-speed/
Page Speed 是開源 Firefox/Firebug 插件。網站管理員和網絡開發人員可使用 Page Speed 來評估他們網頁的性能，並得到有關如何改進性能的建議

11.Dust-me Selectors https://addons.mozilla.org/zh-CN/firefox/addon/5392
Firefox上的一個附加組件，能夠找出沒有用到的CSS選擇符

12.Myspace Performance Tracker http://msfast.myspace.com/
Myspace的性能分析工具, 能夠分析到頁面渲染的各個階段的時間、CPU和內存的消耗狀況，只使用於IE中

13.YUI Compressor http://developer.yahoo.com/yui/compressor/
用java寫的一個代碼壓縮工具，使用方法： java -jar yuicompressor-x.y.z.jar [options] [input file]

14.JS Beautifier http://jsbeautifier.org/
在線JS格式化工具

15.JSLint http://jslint.com/
在線JS校驗工具，使用請注意「JSLint will hurt your feelings.」

16.JSCompress http://jscompress.com/
在線JS壓縮工具

17.JSMin http://www.crockford.com/javascript/jsmin.html
JS壓縮工具

18.HTML2Javascript http://accessify.com/tools-and-wizards/developer-tools/html-javascript-convertor/
HTML到JavaScript轉換器得到置標並將它轉換成一系列能夠在JavaScript塊中使用的document.write()申明

19.Web Developer https://addons.mozilla.org/da/firefox/addon/60?lang=zh-CN
Firefox的一個附加組件，給Firefox增長了一個菜單以及工具欄，裏面包含了不少開發工具

20.JS Regexp Generator http://www.jslab.dk/tools.regex.php
一個製做正則表達式的在線工具

21.Opera Dragonfly http://www.opera.com/dragonfly/
Opera Dragonfly 是Opera瀏覽器的跨設備，跨平臺調試環境—調試 JavaScript, 檢查編輯CSS和DOM， 而且查看移動設備或計算機上的錯誤

22.IE Web Developer http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en
微軟的瀏覽器開發者工具條爲網頁的快速建立，理解和故障診斷提供了各類的工具

23.DynaTrace http://ajax.dynatrace.com/pages/
一個頁面性能分析工具，是針對瀏覽器 IE 6 ~ 8 的。它能夠用來分析頁面渲染時間、DOM方法執行時間，甚至能夠看到 JS 代碼的解析時間。多謝「有米啦」同窗的推薦，好友卓羣的 博客之前也介紹過

24.IE Tester http://www.my-debugbar.com/wiki/IETester/HomePage
IETester是一個免費的瀏覽器，它同時包括了IE 5.五、IE 六、IE 七、IE 8的全部內核，多版本IE測試好工具,DIV測試,CSS兼容和各個版本瀏覽器兼容檢測工具

25.Companion JS http://www.my-debugbar.com/wiki/CompanionJS/HomePage
IE下的js調試工具，須要結合Microsoft Script Debugger使用，經過安裝這個工具，但頁面出現錯誤時會在左上角彈出一個小錯誤提示，點擊會在IE下面顯示出一個錯誤控制檯，就如FF下的 firebug控制檯同樣，錯誤信息提示很詳細

26.Live Http Header https://addons.mozilla.org/zh-CN/firefox/addon/3829
live HTTP headers是firefox的一個插件，能夠查看到http頭，很是方便

27.Closure Compiler http://code.google.com/intl/zh-CN/closure/compiler/ Google的JavaScript編譯工具