常用前端开发工具合集

常用前端开发工具合集

1.Firebug [url]http://getfirebug.com/[/url]
最流行的前端开发工具

2.HttpWatch [url]http://www.httpwatch.com/[/url]
集成在IE和Firefox上的监听HTTP和HTTPS的工具

3.Fiddler [url]http://www.fiddler2.com/fiddler2/[/url]
Fiddler是一个记录你电脑和网络之间所有HTTP(S)请求的网络调试代理

4.HttpFox [url]https://addons.mozilla.org/eu/firefox/addon/6647?lang=en-US[/url]
和HTTPWatch很类似的一个工具

5.Yslow [url]http://developer.yahoo.com/yslow/[/url]
Firebug的一个扩展，可以根据高性能网站的一些准则来分析网页并且提出建议来提高网站的性能

6.Css Usage [url]https://addons.mozilla.org/zh-CN/firefox/addon/10704[/url]
Firebug的一个扩展，可以用来察看哪些CSS被用到了

7.VIM [url]http://www.vim.org/[/url]
一个高级的文本编辑工具，是在UNIX系统上面VI编辑器的升级版本

8.Editplus [url]http://www.editplus.com/[/url]
Windows系统上的一个好用的文本编辑器

9.DNS Flusher [url]https://addons.mozilla.org/en-US/firefox/addon/7408[/url]
Firefox上的一个附加组件，当HOST文件改变时可以很快地更新页面而不需要重启浏览器

10.PageSpeed [url]http://code.google.com/intl/zh-CN/speed/page-speed/[/url]
Page Speed 是开源 Firefox/Firebug 插件。网站管理员和网络开发人员可以使用 Page Speed 来评估他们网页的性能，并获得有关如何改进性能的建议

11.Dust-me Selectors [url]https://addons.mozilla.org/zh-CN/firefox/addon/5392[/url]
Firefox上的一个附加组件，可以找出没有用到的CSS选择符

12.Myspace Performance Tracker [url]http://msfast.myspace.com/[/url]
Myspace的性能分析工具, 可以分析到页面渲染的各个阶段的时间、CPU和内存的消耗情况，只使用于IE中

13.YUI Compressor [url]http://developer.yahoo.com/yui/compressor/[/url]
用java写的一个代码压缩工具，使用方法： java -jar yuicompressor-x.y.z.jar [options] [input file]

14.JS Beautifier [url]http://jsbeautifier.org/[/url]
在线JS格式化工具

15.JSLint [url]http://jslint.com/[/url]
在线JS校验工具，使用请注意“JSLint will hurt your feelings.”

16.JSCompress [url]http://jscompress.com/[/url]
在线JS压缩工具

17.JSMin [url]http://www.crockford.com/javascript/jsmin.html[/url]
JS压缩工具

18.HTML2Javascript [url]http://accessify.com/tools-and-wizards/developer-tools/html-javascript-convertor/[/url]
HTML到JavaScript转换器获得置标并将它转换成一系列可以在JavaScript块中使用的document.write()申明

19.Web Developer [url]https://addons.mozilla.org/da/firefox/addon/60?lang=zh-CN[/url]
Firefox的一个附加组件，给Firefox增加了一个菜单以及工具栏，里面包含了很多开发工具

20.JS Regexp Generator [url]http://www.jslab.dk/tools.regex.php[/url]
一个制作正则表达式的在线工具

21.Opera Dragonfly [url]http://www.opera.com/dragonfly/[/url]
Opera Dragonfly 是Opera浏览器的跨设备，跨平台调试环境—调试 JavaScript, 检查编辑CSS和DOM， 并且查看移动设备或计算机上的错误

22.IE Web Developer [url]http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en[/url]
微软的浏览器开发者工具条为网页的快速创建，理解和故障诊断提供了各种的工具

23.DynaTrace [url]http://ajax.dynatrace.com/pages/[/url]
一个页面性能分析工具，是针对浏览器 IE 6 ~ 8 的。它可以用来分析页面渲染时间、DOM方法执行时间，甚至可以看到 JS 代码的解析时间。多谢“有米啦”同学的推荐，好友卓群的 博客以前也介绍过

24.IE Tester [url]http://www.my-debugbar.com/wiki/IETester/HomePage[/url]
IETester是一个免费的浏览器，它同时包括了IE 5.5、IE 6、IE 7、IE 8的所有内核，多版本IE测试好工具,DIV测试,CSS兼容和各个版本浏览器兼容检测工具

25.Companion JS [url]http://www.my-debugbar.com/wiki/CompanionJS/HomePage[/url]
IE下的js调试工具，需要结合Microsoft Script Debugger使用，通过安装这个工具，但页面出现错误时会在左上角弹出一个小错误提示，点击会在IE下面显示出一个错误控制台，就如FF下的 firebug控制台一样，错误信息提示很详细

26.Live Http Header [url]https://addons.mozilla.org/zh-CN/firefox/addon/3829[/url]
live HTTP headers是firefox的一个插件，可以查看到http头，非常方便

27.Closure Compiler [url]http://code.google.com/intl/zh-CN/closure/compiler/[/url]
Google的JavaScript编译工具


原文：[url]http://www.cnblogs.com/Franks_blog/archive/2010/05/26/1744173.html[/url]