您的JavaScript工具链中有什么?

时间:2009-09-26 01:28:35

标签: javascript frameworks workflow development-environment

我希望开始用JavaScript编写一个复杂的应用程序,以便在网上运行。我之前在JavaScript中编写了一些一次性代码,直接使用DOM和一些jQuery。但这是我第一次写一个完整的应用程序来在浏览器中运行。

所以,我想知道人们喜欢在JavaScript中进行认真开发的工具链。特别是,我对以下内容感兴趣,以及有关您选择所做组件的原因以及它们如何与您的工作流程相结合的一些信息:

  • 您使用哪些编辑器和编辑器插件/模式/脚本?我通常是Emacs用户,目前正在使用js2.el,但我很想听听其他设置。
  • 您使用任何类型的IDE(Aptana,Dashcode等)吗?
  • 您使用哪些JavaScript库或框架?
  • 您是否使用任何编译为JavaScript的语言(GWT,haxe,Objective-J)?
  • 您使用哪些单元测试框架?你怎么调用它们?可以从编辑器/ IDE,命令行,网页浏览器,JavaScript调试器调用它们吗?
  • 您使用哪些自动用户界面测试工具(例如Selenium,W​​atir,Sahi)?再次,如何调用这些? (能够从命令行调用单元测试和接口测试对于运行buildbots非常有用)
  • 您使用了哪些其他代码质量工具(JSlint,代码覆盖工具或任何类型的工具)?
  • 您在调试环境中使用了什么(Firebug,WebKit检查器等)?它与您的编辑器或IDE有任何集成吗?
  • 在部署代码之前,您对代码运行了哪些后处理(混淆器,缩小器,任何类型的优化器)?
  • 您是否有任何工具可用于管理模块依赖项或根据需要动态加载代码?我正在编写的应用程序将使用大量代码,并且我希望减少加载时间,因此用于跟踪所需模块或按需加载代码的工具将会很有帮助。
  • 您的工具链中是否还有其他必备工具(特定于基于浏览器的应用程序的JavaScript开发;我已经有一个非常好的版本控制系统,错误跟踪器等)?

我对“这里有一堆你可以使用的东西”(我知道很多可用的工具)的列表不太感兴趣,而且你在实际中实际使用的堆栈中有更多一切都融合在一起。我希望主要将其作为客户端应用程序开发,服务器只用于身份验证以及存储和检索数据,因此我对您使用的服务器端框架不感兴趣,除非它对客户端不可或缺。以某种方式编写代码。

编辑:我对单元和用户界面测试框架以及如何自动化它们特别感兴趣。我更喜欢能够从命令行运行一个“make test”或“rake test”任务来运行项目的所有测试,并根据测试的成功或失败返回状态。这样可以更轻松地与buildbots集成。另外,我感兴趣的是,是否有人编写可以在浏览器外部(在Rhino,spidermonkey,v8等中)运行的单元测试,以获取不依赖于浏览器的代码,以便更快地完成部分测试。测试

10 个答案:

答案 0 :(得分:31)

  

什么编辑和编辑   插件/模式/脚本你用吗?我   通常是Emacs用户,我正在使用   js2.el此刻,但我   有兴趣听到其他的   设置。

我通常使用Textmate(包含JavaScriptjQueryPrototype个捆绑包。在进行繁重的前端开发时,我会在HTML,CSS和JavaScript文件之间快速切换,我会选择vim的拆分面板视图。这样做时,我会使用macvim或终端+ Visor,具体取决于我的心情。显然,我是Mac用户。

  

你使用任何类型的IDE(Aptana,   Dashcode等等?

没有。我曾经使用Coda,但它的文本编辑器功能还有很多不足之处。我也玩过Espresso玩具,这很有意思......但是很好。

  

什么JavaScript库或   你使用框架吗?

我同时使用jQueryPrototype,具体取决于项目的需求。为了说明每个框架的优势,我喜欢将jQuery称为 DOM操作框架和Prototype a 脚本框架。因此,我倾向于在项目上使用jQuery,这些项目专注于标记和Prototype,而不是脚本更大的应用程序类型的项目。

  

您使用的是哪种语言?   编译成JavaScript(GWT,haxe,   目标-J)?

绝对不是 - 我对这种框架抱有哲学上的抱怨。与服务器端代码不同,前端代码在用户的浏览器中运行,在您无法控制的环境中。因此,我认为JavaScript开发人员有责任生成最佳代码。次优代码可能会产生性能影响,而像Objective-J这样的语言编译的JavaScript(这是我使用过的列表中唯一的代码)将永远不会像强大的JavaScript开发人员生成的代码那样紧密。

  

您使用哪些单元测试框架?   你怎么调用它们?他们可以吗?   从您的编辑器/ IDE调用   命令行,来自浏览器中的   网页,来自您的JavaScript   调试器?

我是jQuery单元测试框架QUnit的忠实粉丝。 Dojo的DOH Unit Testing也很好。

不要错过FireUnit,这是一个漂亮的Firebug扩展单元测试。

另见Razor

  

什么是自动化用户界面测试   你使用的工具(如Selenium,   Watir,Sahi)?再次,这些怎么可能   调用? (能够调用单位   来自的测试和接口测试   命令行非常有用   运行buildbots)

必要时我使用Selenium,但这种情况很少见。

  

您使用的其他代码质量工具(JSlint,代码覆盖率工具,   或任何类似的东西)?

我使用和爱JSLint

Firebug有一个很好的code coverage extensionHRCov被广泛认为是最好的。在我的大部分日常JavaScript工作中,我没有太多使用代码覆盖。

  

您的调试用途是什么?   环境(Firebug,WebKit   检查员等)?它有没有   与您的编辑器或IDE集成?

就我而言,Firebug是JavaScript开发的杀手级应用。一些有用的调试功能:

WebKit Inspector很好,DragonFly也很好,而Debug Bar对于追踪IE漏洞非常有用......但FireBug对我来说很棒。

  

您运行了哪些后期处理   您的代码在部署之前   (混淆器,缩小器,任何一种   优化器)?

我非常故意不使用任何后期处理工具 - JavaScript的一个重要方面是它的开放性,我不想让刚刚起步的JavaScript开发人员更难以从我的工作中学习。更不用说重建混淆的JavaScript非常简单。

只有一个实例,我需要缩小JavaScript以节省带宽。在这种情况下,我设置了一个SVN post-commit hook来运行Doug Crockford的优秀JSMin

  

还有其他必备工具吗?   你的工具链(特定于   浏览器的JavaScript开发   基础应用;我已经有了   完美的版本控制系统,   bug跟踪器等)?

答案 1 :(得分:8)

在提出这个问题时,Google’s closure compiler没有争用 这是一个非常好的工具,可以比其他许多人更好地最小化JavaScript。您可以使用page speed运行它来分析现有网站。它内置了许多其他功能,如检测死代码,引用等。

答案 2 :(得分:3)

  • IntelliJ IDEA / RubyMine进行编辑。
  • jQuery +插件因为它与Ruby的相似性
  • 您是否使用任何编译为JavaScript的语言(GWT,haxe,Objective-J)?
  • JSUnit与Blue Ridge(Rails包),但更多地依赖Selenium测试
  • 除了对编程和测试之外,没有代码质量工具
  • 主要使用Firebug进行调试
  • 依靠gzip压缩来减少空间
  • 创建大量小型模块化JS文件
  • 使用rails静态组合并根据需要自动包含这些文件。这是自定义代码,但我发表了博客。这使您可以随着开发的增长保持模块化
  • 构建相当多的jQuery插件来管理网站上的小部件

答案 3 :(得分:3)

刚开始使用RubyMine作为JavaScript IDE,纯粹是为了支持JavaScript,这非常好。它与IntelliJ IDEA中的相同。

对于调试来说,Firebug是一个显而易见的必备产品,尽管在我看来它最近有点下滑了。我倾向于使用日志而不是调试器,因此我发现 log4javascript 非常有用(尽管我应该指出我确实写了它)。我还偶尔使用WebKit的inspector thingy和IE 8的调试器,以及Visual Studio的IE早期版本的调试器。

对于代码质量,我手动使用JSLint,偶尔使用JSLint,因为我不同意它的一些建议。 RubyMine / IntelliJ还有大量的JS“检查”,可以在编写代码时对其进行分析,并在代码旁边生成警告,我认为这些代码很有用。

我倾向于在一些开发页面上开发,这些页面包含单独的,未经编译的脚本,在创建构建时,我运行一个构建脚本(我自己的,用Ant编写),从版本控制中检出我的代码,连接各个脚本,删除日志记录和调试调用,缩小/压缩(使用JSMin或YUICompressor)代码,并运行单元测试。我的单元测试脚本是我自己的,并没有什么大不了的。

它运作得相当好,但并不完美。

答案 4 :(得分:2)

我还没有用Javascript编写任何大量内容(在我最新的项目中大约有3000行),但是我在我的部署/构建脚本中使用我需要的所有库来缩小/组合它的JSLint代码。我的构建脚本还更改HTML直接导入脚本和库,以及导入生产压缩代码。这样,您就不必运行构建脚本来查看开发中的变化,这是必不可少的。

YUI Compressor非常慢,特别是因为它启动了JVM才能运行,但它完成了工作。部署脚本中的某种缩小对于删除所有注释至关重要,如果您避免使用全局变量,您也将获得有意义的标识符名称长度压缩量,但在gzip之后没有太大的好处。可能你需要另一步来删除console.debug行和其他调试代码。

用于调试,FireBug。我确定webkit调试器也很好。

对于开发,vim使用改进的js缩进脚本和带有一些js修改的ctags。我不确定真正的IDE有什么优点,但我确信有一些。默认情况下,Vim不会在javascript字符串中对HTML进行语法高亮显示,而是apparently it can be configured to

JSLint很容易在Rhino中运行,但是spidermonkey可以快速完成大约3倍,因为它不需要启动JVM。克罗克福德不支持这种安排,但我设法让它以某种方式运作。

答案 5 :(得分:2)

我的技术堆栈(asp.net mvc)略有不同,但在这里:

  • IDE:Visual Studio 2008 + ReSharper,Asp.Net MVC
  • 编辑:Notepad ++(我的大部分时间都在VS中,但Notepad ++有更好的JavaScript语法高亮显示)
  • 开发者浏览器:FireFox + Firebug + YSlow + PageSpeed + FireCookie 还要添加开发人员工具栏
  • 其他浏览器:IE8,Chrome 3,Safari,Opera(很少使用),IE6和IE7通过虚拟机(可从Microsoft免费下载的虚拟PC映像)。
  • 后处理:JLint和YUI Compressor。我有一个构建任务做YUI压缩器部分。
  • JavaScript Framework:JQuery + JQuery UI
  • 其他内容:JQuery Validation,JSON2

答案 6 :(得分:1)

  • 编辑器:记事本或任何其他文字 语法高亮的编辑器

  • IDE:可以是Dreamweaver,Aptana, Netbeans - 取决于您的个人 偏好。

  • Javascript框架:我更习惯了 到jQuery,我仍然建议 jQuery的。
    你可以考虑在jQuery中添加一些“插件”。有些真的很酷。像Facebox(http://famspam.com/facebox) - 一个类似jQuery Facebook的弹出框,易于使用。或jQuery Cookie插件

  • 调试:Firebug(FireCookie,第2页) 速度,YSlow) - 没有集成 IDE,但在浏览器上是神奇的。如果 你需要跨浏览器调试 可以去Firebug Lite。

    您可以轻松地使用console.log()来调试而不是警告(特别是当您使用大量回调,定时器,AJAX等进行javascript时。您不希望使用警报语句来打破它的方式最初应该是。

  • 后处理:包装工 - http://dean.edwards.name/packer/

答案 7 :(得分:1)

Google wave is powered by GWT所以对于更大的应用来说,它似乎是一个不错的选择。

答案 8 :(得分:1)

我使用Dashcode开发Mac Widgets,因为它“ok”并且有很多面向小部件的功能,但是对于其他一切,TextMate

答案 9 :(得分:0)

我唯一想保留的就是jQuery,以便于DOM操作,但这不是必需的。我不依赖任何框架或其他任何东西。如果我需要编写某些东西,我可以在vim或任何可用的文本编辑器中编写它(因为我认为IDE适用于懒惰的人或公司/企业环境中的人)。如果我需要使用一个框架,我会出于我的目的去寻找一个框架。但是最终,我只写了Javascript。我没有专门研究任何框架,因为它们最终都变成了老新闻。仅仅知道dang语言的工作原理,并能够在任何情况下或任何情况下工作,而无论是否具有框架或库来始终握住您的手,功能都将更为强大。