Firefox 开发者工具工作周总结

上周在桑尼维尔,我们举办了第一次开发者工具工作周,包括最近整合的 Jetpack 团队(关于本周的不同看法,请参见 Paul 的帖子)。真是太棒的一周了!我对许多我原本以为只是有趣想法的东西突然变成了真正可以运行的东西感到震惊。到星期五早上,团队展示了一些很棒的演示,我将尝试根据主题将它们归类。

远程控制一切,无处不在。

在未来 3 个月内,我们将为我们发布的所有开发工具实现远程协议支持。远程协议是一个网络客户端/服务器协议,它将开发工具暴露给彼此,以及像编辑器这样的外部工具,以及 Android 和 Firefox OS 上的 Firefox。我们有一些很棒的演示,利用或扩展了这些功能。

  • 基于 Heather Arthur 在实现远程样式编辑方面的工作,Paul Rouget 以远程 CSS 编辑从流行的编辑器 Sublime Text 2 中震撼了我们,很快也震撼了其他许多人:(推文YoutubeGithub)。
  • Joe Walker 展示了如何在 Firefox 桌面不同实例之间远程运行 gcli 命令。
  • Jim Blandy 带领我们了解了一些重要的平台修复,这些修复将使 Firefox OS 上的内容进程调试成为可能。这将使我们能够支持对 B2G 应用程序进行远程设备调试。

革命性的 Dev Tools 黑客

许多团队成员在他们现有的项目上做了很多工作,并在本周结束时向我们展示了一些很棒的增强功能。

  • Mihai Sucan 展示了 Global Console 的进展,它现在可以理解所有网络请求,并且还支持 stdin/stdout 和一些方便的计时实用程序。
  • Anton Kovalyov 展示了 Codemirror 的初始集成,作为 devtools 的源代码编辑器,取代了当前的 Orion 编辑器。
  • Nick Fitzgerald 使源代码映射与调试器一起工作,并为我们演示了 Coffeescript 调试。
  • Joe Walker 重构了 gcli 命令以将处理与呈现分离,从而使实现使用通用数据格式化程序的多个命令变得更加容易。
  • 最后但并非最不重要的是,Victor Porov 带领我们了解了一个完全可操作的网络面板,它几乎准备就绪!
  • Stephen Shorlander 展示了一些关于定义 浏览器内 Web 应用程序开发 可能是什么样子的第一步。

开发者工具 + Jetpack == 超级大国!

星期二,Paul Rouget 带领我们了解了初具雏形的开发者工具 API,并向 Jetpack 团队提出了挑战,让他们看看如何使与开发者的合作变得更简单。到星期五,Irakli 通过向我们展示一个名为“附加组件板”的 Jetpack 附加组件来应对挑战,用于对基于 SDK 的附加组件进行实时编码。

Dave Camp 对 Jetpack 的可能性有略微不同的看法,在本周结束时,他能够展示一个开发者工具代码库版本,该版本可以使用 Jetpack 的 CommonJS 加载器从磁盘动态重新加载,而无需重新构建甚至重新启动 Firefox。

Dave Townsend 也不甘示弱,对 倾斜模式 进行了一些调整,以将其暴露给附加组件,甚至从头开始进行一些修改,以根据附加组件或从头开始注入的任意代码来改变倾斜模式如何可视化页面。

Paul 最近还发布了他优秀的 Firefox 终端附加组件的新版本,您应该 立即安装它!马上!当你回来时,我还会在这里。

附加组件开发者之爱

开发者工具团队一直专注于改善 Web 开发者的生活,但 Firefox 本身是使用 JS 和 CSS 等 Web 技术创建和扩展的。在这个第一个包括 Jetpack 团队的 Devtools 工作周中,我们看到了一些非常有希望的工作。

  • Eddy Bruel 解决了一些我完全不理解的错误,在本周结束时,他向我们展示了针对几乎所有浏览器 chrome 和附加组件 JavaScript 代码的调试。仍然有一些已知的限制需要解决(目前并非所有附加组件或内容脚本都可以调试),但对于今天的 Nightly 版本,浏览器对于开发者来说已经非常有用。
  • Mihai Sucan 和 Alexandre Poirot 对 SDK 和 Global Console 都进行了更改,这些更改将把 Jetpack 代码中对 console.log 的任何调用都传递到 Global Console,从而极大地改善了附加组件开发者的“printf”式调试。

其中一些黑客在上周工作周期间就落地了,许多黑客将在接下来的几周内落地。如果您想参与推动这些功能的实现,请在 irc.mozilla.org 上找到我们在 #devtools 和 #jetpack,或者在 mozilla.dev.developer-tools 上的开发者工具项目邮件列表。

关于 Jeff Griffiths

Jeff 是 Firefox 开发者工具的产品经理,偶尔也是 Open Web 黑客,常驻加拿大不列颠哥伦比亚省温哥华。

更多由 Jeff Griffiths 撰写的文章…

关于 Robert Nyman [荣誉编辑]

技术布道者和 Mozilla Hacks 编辑。发表关于 HTML5、JavaScript 和开放 Web 的演讲和博客。Robert 坚信 HTML5 和开放 Web,自 1999 年以来一直从事 Web 前端开发工作,分别在瑞典和纽约市。他还定期在 http://robertnyman.com 上发表博客,喜欢旅行和结识新朋友。

更多由 Robert Nyman [荣誉编辑] 撰写的文章…


21 条评论

  1. Michael Bashkirov

    http://i.imgur.com/FldgNq0.png 上的 UI 主题是什么?
    我可以使用它吗?

    2013 年 3 月 20 日 下午 7:04

    1. Jeff Griffiths

      当然,这是 Firefox 团队当前正在开发的新 Australis 主题的 OS X 风格。有关更多信息,您可以尝试从这里下载“UX”Nightly 版本:

      http://people.mozilla.org/~jwein/ux-nightly/

      有关 UX 版本的更多信息,您应该阅读 Jared Wein 的帖子:

      http://msujaws.wordpress.com/2012/03/15/mozillas-ux-nightly-build-of-firefox/

      2013 年 3 月 20 日 上午 9:18

  2. Omega X

    仍在等待一个像样的时间线功能。

    2013 年 3 月 20 日 下午 12:49

    1. Jeff Griffiths

      Victor 上周向我们展示了一个非常精致的版本,我们希望它在接下来的几周内发布。抱歉,我没有手头的屏幕截图,但它确实存在!

      2013 年 3 月 20 日 下午 1:32

      1. Omega X

        太棒了!我期待着它。

        2013 年 3 月 23 日 上午 3:34

  3. WebDev

    Firefox 会为 Web 存储、IndexedDB 和应用程序缓存集成检查器吗?我认为它可以成为一个非常有用的功能。

    2013 年 3 月 20 日 下午 8:44

    1. Jeff Griffiths

      这绝对是一个很受欢迎的请求,但在接下来的一个月或两个月内没有计划。感谢您的反馈,听到这个特定请求有助于团队在权衡关注的重点时对其进行优先排序。

      2013 年 3 月 20 日 下午 8:59

  4. aL3xa

    我认为我会因为我对自动完成功能的不断抱怨而陷入迷因。Paul Roget 确实在我之前的一篇抱怨中回复说它是一个“正在进行中的工作”。关于它何时可能出现在 Nightly 版本中,有没有粗略的估计?

    2013 年 3 月 21 日 上午 6:29

    1. Jeff Griffiths

      嗨 aL3xa,

      Paul Rouget 说得对,我们正在进行中,但现在还没有接近发布。

      2013 年 3 月 21 日 下午 3:48

  5. Aras

    这真是太棒了,而且令人兴奋。CSS 实时编辑是否依赖于 sublime text,或者它也可以与其他编辑器一起使用?我使用 vim,希望在我的工作流程中加入一些实时功能。干得好!

    2013 年 3 月 21 日 下午 3:47

    1. Jeff Griffiths

      Aras:这个项目的理念是创建一个 Python 库作为参考实现——Paul 已经为 Vim 添加了支持,尽管他在工作周提到由于 Vim 是单线程的,所以它很慢。我希望社区能够在各种编辑器中提供良好的支持,希望我们的开放式远程协议开发方法能够激发他们的灵感。

      2013 年 3 月 21 日 下午 3:51

  6. River Cities Media

    这真是太棒了。我一直很喜欢探索新的开发工具。

    2013 年 3 月 22 日 上午 1:36

  7. Brant Watson

    我想知道为什么所有这些精力都投入到制作横向工具上。在许多方面,我更喜欢 Firefox 的内置工具而不是 Firebug 和其他工具,但它被限制为横向界面让我感到恼火。如今的显示器正在加宽纵横比,但很多内容仍然是垂直的。这意味着浏览器左侧和右侧的空间浪费了。有一段时间我有一个 mod 可以给我侧边标签,而且它确实工作得很好。

    Firebug 允许我将开发工具放在屏幕的左侧或右侧,而不是占用整个水平空间。这对于在查看 JS 控制台输出和其他信息时与页面进行交互非常宝贵。水平布局的问题是,为了显示合理数量的调试数据,我需要使用很多垂直空间,这会阻止我以通常的方式使用网站本身,这使得测试有时很痛苦。

    是否有任何计划来更好地利用这些浪费的空间?

    2013 年 3 月 25 日 上午 7:16

    1. Jeff Griffiths

      在当前的 Aurora 版本中,您可以在 about:config 中切换一个首选项,以使开发者工具工具箱显示在侧面而不是底部。

      https://www.evernote.com/shard/s1/sh/42072ede-b716-43fe-a768-22cebfbedde4/9330a9938b5f595e756b3ef2a7254460

      这是一个正在进行的工作,但对我来说,对于大显示器来说已经是一个进步了!

      2013 年 3 月 25 日 上午 10:46

      1. Brant Watson

        太棒了!这就是我缺乏这方面的知识所得到的。非常感谢你指出这一点,我非常感谢。

        2013 年 3 月 25 日 上午 11:42

      2. Pablo Olmos de Aguilera C.

        在之前的几个版本中(我相信)css 会出现在右侧,检查器和其他所有内容都在下方。我看到我可以把它放在右边,但我真的很喜欢之前的行为……有没有办法复制它?

        2013 年 4 月 8 日 下午 5:35

  8. Costa Michailidis

    太棒了!浏览器内的编辑器是否正在为 Firefox 21 开发?

    2013 年 3 月 25 日 上午 10:28

    1. Jeff Griffiths

      不,Firefox 21 即将进入测试版,这些更改尚未在 nightly 版本中发布(目前是 Firefox 22,很快就会是 Firefox 23)。

      2013 年 3 月 25 日 上午 10:31

  9. Rugby

    Adobe Brackets 允许使用 Chrome 实时编辑网站。

    2013 年 3 月 29 日 上午 7:21

    1. Jeff Griffiths

      那是真的,Brackets 团队正在做着很棒的工作,希望我们能看到对 Firefox 的支持。我想要看到的是这种实时编辑功能在各种文本编辑器中都能实现:vim、Komodo、ST2、eclipse、Brackets,等等。

      2013 年 3 月 29 日 上午 11:05

  10. RobertCZ

    对不起,如果这是一个愚蠢的问题,但我不知道如何配置控制台在重新加载后清除——这可能吗?
    否则——当前的 nightly 版本令人印象深刻,我开始每天使用它而不是 Firebug,它对我来说非常接近(右侧面板功能非常棒)

    2013 年 4 月 11 日 上午 0:37

本文的评论已关闭。