带有jQuery应用程序的Google Closure Compiler

Tau*_*ren 38 jquery google-closure google-closure-compiler

我有很多时间投入到jquery和用它构建的大型应用程序中.最近我一直在审查Google Closure Library,但此时发现它并不像jquery那样优雅.我相信它可能有一些潜力,并会更多地研究它,但是现在我打算继续使用jQuery作为我的基础框架.

但是,我对Google Closure Compiler印象非常深刻.我希望在我的应用程序的构建过程中开始使用它.遗憾的是,将其用于不遵循标准Google Closure标准的项目并不容易.

在开发基于jquery的项目和使用Google Closure Compiler方面是否有任何最佳实践或良好资源?例如:

  1. 使用它编译jquery和jquery-ui是否有意义,还是应该继续在google CDN上指向这些资源?我确定我的jquery和jquery-ui会更小,因为我没有使用库的所有功能,但是指向CDN会增加文件已经存在于访问者缓存中的机会.

  2. 我的应用程序被拆分成许多文件,每个函数都有一个文件.我想按照特定的顺序将它们组合在一起,并将它们缩小为我网站上每个部分的文件.我想自动化这个过程.

  3. 目前我的项目有一个java后端,并使用Maven构建.将Google Closure Compiler添加到此构建过程中是否有意义?

基本上,我正在寻找任何特定于使用Google Closure Compiler和jQuery的优秀资源.

Anu*_*rag 10

Google Closure Compiler是jQuery或任何其他库不可知的.它有两种类型的优化 -

  • 简单
  • 高级

我尝试应用高级优化,但它严重破坏了我的应用程序.如果它是相同的,您可以尝试修复您的应用程序,或使用简单的优化.通过简单的优化,大小减少了32%,使用高级优化大约减少了68%,但这无论如何都无法解决.

将JS连接以自动方式移动到构建过程中绝对是可行的方法.见的JavaScript依赖管理.

jQuery已经针对字节大小进行了大量优化,因此我怀疑你是否能够通过使用Google Closure Compiler来充分利用它,但是当你的项目结合时,它值得一试.

我认为Google Closure Library是有利的,但还没有使用它,因为我现在在MooTools上投入了大量资金.看看它的API,除了DOM操作,AJAX处理,事件处理等之外,它似乎对它提供的内容有相当广泛的报道.

  • "jQuery已经针对字节大小进行了大量优化,因此我怀疑你是否能够通过使用Google Closure Compiler来充分利用它":未来可能会发生变化.JQuery团队正在研究Closure Compiler的高级优化(特别是删除死代码),以自动删除您的应用实际上没有使用的任何功能.如果它平息,这将是非常棒的!http://blog.jquery.com/2011/11/22/call-for-jquery-1-8-ideas/ (2认同)

小智 10

$(elem)['width']() 代替 $(elem).width()

这适用于ADVANCED_OPTIMIZATIONS,因此闭包编译器不会重构jQuery方法.

  • @ Tracker1这无济于事:编译器会正确地调用`$`但是"优化"这些方法,所以`$(elem).width()`会变成类似`$(elem).a()`的东西. (3认同)

HOC*_*OCA 9

我相信从1.4.2开始(可能更早),jQuery默认使用Google Closure Compiler缩小.所以最好通过谷歌CDN继续引用jQuery/jQuery UI.但是,将Closure编译器集成到构建过程中以组合和缩小JS文件仍然有好处.也就是说,为了提高客户端页面加载性能,减少了每页加载的JS请求和更小的数据传输.这些是我们在将Closure编译器集成到构建过程中时遇到的一些挑战:

  1. 构造编译命令 - 我们需要一种在构建过程中以自动方式调用编译器和所有必需参数的方法.对我们来说,这意味着编写一个控制台应用程序来构造命令.如果您的环境中有shell脚本,那么这可能是一个优势.

  2. 管理依赖关系 - Closure编译器确实能够自动对组合JS的顺序进行排序,从而保留依赖关系.为了利用此功能,必须对JS文件进行注释,goog.provide\goog.require以告诉编译器依赖项是什么(--manage_closure_dependencies).编译器还将goog.require从组合的JS中排除任何不需要的JS(即,不通过语句引用).以下是一些需要注意的事项:

    • 如果要在组合输出中包含所有JS文件,请确保在编译中包含"清单"JS文件,该文件仅包含goog.require要包含在组合脚本中的每个文件的goog.provide语句(即无语句).
    • 如果您未使用Closure Library,请确保使用SIMPLE_OPTIMIZATIONS或更高版本进行编译.否则,编译器不会删除goog.provide/goog.require语句.或者,您也可以定义自己的goog.provide/goog.requireJS函数以避免错误.
    • 确保没有周期性依赖,或面临后果.
  3. 编译组合脚本的调试版本 - 如果需要,可以使用--formatting PRETTY_PRINT标志编译组合脚本的调试版本.这将输出格式为空格的等效脚本,用于开发/调试.

虽然Closure编译器文档有时可能很稀疏,但它确实足以在大多数情况下开始并且不断改进 - 所以定期检查更新,而不仅仅是SO;)

希望这可以帮助.


Fat*_*cet 6

使用jQuery和闭包编译器高级模式

  • 写答案是使用`extern`文件. (3认同)

Ste*_*ung 5

jQuery与高级模式下的Closure Compiler不兼容.我同意将它兼容是一件非常好的事情,因为它的方法链式语法很容易为虚拟化原型提供大大提高的执行速度.

事实上,在流行的JavaScript库(除了Closure Library之外)中,只有Dojo Toolkit与Closure Advanced模式兼容.

http://dojo-toolkit.33424.n3.nabble.com/file/n2636749/Using_the_Dojo_Toolkit_with_the_Closure_Compiler.pdf?by-user=t