原文地址：

 

让Web开发人员的生活尽可能轻松和高效，这是Firefox一直坚持的目标之一。通过提供工具和可扩展的web，让开发人员能够创造出令人惊奇的东西。

Firefox自带的开发工具

我们致力于开发一系列包含在Firefox内的开发工具。它们在  中有更详细的描述，有了它们我们就能做出一些很有趣的事。

我们对大量的用户接口和编码方式进行测试和评估，从而找出在页面中最理想的编码方式。如果你安装了Firefox Aurora，你现在就可以试试！让我们知道你的想法。

继续关注本博客，我们会持续更新自带开发工具的进展和功能。

 

Firebug

目前为止，浏览器中最著名的web开发工具当属Firebug，毋庸置疑，在相当长的一段时间里，它将成为web开发与调试的标准。Firebug还拥有许多强大的功能，包括大量的插件（见下文）。

但是有件事你需要明白，那就是如果你安装了过多的Firebug插件，它将占用大量内存，所以要选择适合自己的。（编注：推荐阅读 《》）

 

一、针对web开发者的Firefox插件

多年来，已经有很多插件能够帮助web开发者最大限度的利用Firefox。下面将列出其中最著名、使用最多的，如果我们疏漏了什么，请在评论中告诉我们！

为web开发者提供测试web资源的辅助功能。

AiOS可以让你打开多个窗口作为侧边栏，并能在它们之间快速切换。有了它，你就可以告别杂乱无章的窗口了！除了书签和历史记录，它还可以在侧边栏中打开下载，插件等对话框。

轻松查看和管理缓存。

轻轻一点，就能禁用（或清除）浏览器缓存。

高级取色器，拾色器，渐变色生成器和其他一些功能。

Console2可能会成为下一代错误控制台，从而取代JavaScript控制台。从v0.5版本开始就有控制台过滤器插件，之前只能在Console2网站上获取。

CSS Reloader可以让你重载任何网站的CSS，而不需要重载页面。

DOM Inspector可以用来审阅、编辑web文档或XUL程序中使用的DOM。在双窗口中以不用的视图显示文档及内部节点，并控制DOM。

可对Firefox中的视频和音频进行编码。利用Firefogg你可以把大部分媒体文件编码为Ogg或WebM。Firefogg还提供API来把编码过程整合到上传进程中。

FireFTP是Firefox上一款免费、安全、跨平台的FTP/SFTP客户端，可以简单、直观的连接到FTP/SFTP服务器上。

一款JavaScript单元测试插件程序。

显示水平和垂直参考线，跟你在PhotoShop里用的一样。有助于改善布局，把元素放在适当的网格中，对称排布元素，构造出一个设计。

FoxyProxy是一款高级代理管理工具，完全替代了Firefox本身有限的代理功能。它比SwitchProxy、ProxyButton、 QuickProxy、 xyzproxy、 ProxyTex、 TorButton等拥有更多的功能。

把你定位到你想要的位置。

通过使用少量JavaScript，可以自定义网页的显示方式。

HTML Validator是一个Mozilla插件，它在Firefox和Mozilla中添加了HTML验证。可以在图标上看到一个HTML页面的错误数量。

一个用于Firefox的HTTP分析器插件。

是Firefox自动化。记录并重播重复工作。如果你喜欢Firefox浏览器，却对重复的任务（例如，每天访问相同的网站，填写表单，记住密码等）感到厌烦的话，iMacros for Firefox便是你梦寐以求的解决方案！

Monitor Jenkins（http://jenkins-ci.org）在Firefox状态栏中创建并显示当前状态。

内嵌于浏览器的jQuery和jQuery UI。

以简单、低调的视图漂亮的显示出浏览器中JSON的内容。

显示浏览器中的JSON文档。

如果你正在访问的网站包含了任何外部js/css文件，图标上就会显示“SS”、”JS”或者都有。点击文件名就能查看各个文件。文件会在新窗口中打开。

通过在工具栏按钮上添加首页、上一页、下一页、尾页来简化页面导航（例如在线漫画、论坛或者技术规范，比如：HTML4建议）。

在浏览网页时查看HTTP头信息。

LiveReload能在文件发生改变时刷新网页。

可以在任何网页上显示标尺，用来检查宽度、高度，或者以像素为单位对其页面元素。

能够添加、修改、过滤发送给web服务器的HTTP报头，这个插件特别有助于移动web开发、HTTP测试和隐私保护。

浏览器上最好的安全插件。只有你信任站点上的活动内容才能运行，保护你免受跨站脚本攻击和点击劫持攻击。

Page Speed是由Google发起的开源项目，旨在通过应用web性能最佳实例来帮助开发者优化他们的网页。

PixelZoomer能够对当前网站进行截图，并提供多种像素分析工具。你可以放大网站（最大3200%），测量间距并用取色器取色。

抓取屏幕和网页图片变得轻而易举。有了Pixlr Grabber，只需点击右键，你就可以复制、保存、分享甚至编辑你的最终抓取效果——包括所有图片或者背景。

一个与网络服务和其他网络资源交互的开发者工具，可以让你制作HTTP请求，设置实体段和内容类型。允许你与网络服务相互并查看结果。

可以在状态栏或者工具栏快速开启或禁用Java、Javascript、Flash、 Silverlight、Images、样式表和代理，而无需打开任何对话框。

针对web开发者的颜色工具。选色器、取色器+保存颜色，还能通过拖放提取颜色。

测试正则表达式的工具，带有颜色高亮（包含子匹配项），也是创建表达式的帮手。

一个非常简单的插件，用来清除当前打开站点的cookies。它在网页的右键菜单中添加了一个选项，用一键清除Cookies按钮来执行操作，会在状态栏中显示其状态。

只需轻轻一点，就能捕获、抓取、保存、下载或者复制任何你在浏览器中能看到的东西！Screenshot pimp是目前为止Windows和Mac上定制性和用户体验最好的截屏工具栏。

管理你电脑上所有的SQLite数据库。

用一个简单的工具栏按钮来打开selenium IDE。你需要已经安装了selenium IDE：http://seleniumhq.org/projects/ide/

Seoquake是一款FirefoxSEO插件，旨在帮助那些涉及搜索引擎优化（SEO）社会媒体优化（SMO）和网络促销的人。Seoquake可以审查很多重要的SEO参数。

在状态栏显示当前页面的IP地址。还允许通过IP（右键单击）和hostname（左键单击）查询自定义信息服务，例如whois、netcraft等。此外，你还可以复制IP到剪贴板。

用Stylish重构网页，它是一款用户风格管理器。Stylish能让你轻易的为很多网站安装主题和皮肤，像Google、Facebook、YouTuBe、Orkut等，你甚至可以自定义Firefox或者其他程序的主题。

使用tamperdata可以查看、修改HTTP/HTTPS头及post参数。

只需通过一个简单的按钮，你就能了解一个网站是否能够访问。

一个基于WebGL的插件，可以让网页变成3D可视化的效果。

能够一次执行多种不同的验证。包括外部的、内部的或者本地网页（需要从获取一个桌面工具）。

TryAgain会在服务器不能访问时，不断尝试加载网页。

User Agent Switcher添加了一个菜单和一个工具栏按钮，来控制浏览器的用户代理。

Wappalyzer是一个能够发现网站开发技术的浏览器插件。

Web Developer会在浏览器中添加各种web开发者工具。

 

二、Firebug extensions

在一些不同情况下，会用到很多Firebug的插件，在这里会列出其中一部分：

Acebug对Firebug命令行进行语法高亮，并具有模糊自动完成功能。

这个Firebug插件用来报告Jacascript的代码覆盖率。

用来查看使用了哪些CSS规则的Firebug插件。

Firecookie是一款可以查看、管理浏览器Cookies的Firebug插件。

查找与选中的CSS选择器或XPath表达式相匹配的HTML元素。

FirePHP通过一个简单的PHP方法调用，就能让你记录你的Firebug控制台。

针对jQuery开发的Firebug插件。

让Firebug界面友好，更易于使用。

Inline Code Finder是一个Firebug插件，能发现HTML元素中存在的这些问题：内联JavaScript事件、内联样式、javascript: links。

Firebug中的JacaScript语法高亮工具。

NetExport是一个Firebug插件，可以导出所有Net panel中收集和计算的数据。创建的文件使用HTTP存档（HAR）格式（基于JSON）

Pixel Perfect是一个Firebug插件，能够让web开发者和设计师轻松的把一张web构图覆盖在开发的HTML页面上。

YSlos能够分析网页载入缓慢的原因，基于Yahoo!的高性能网站标准。