基础:
closure compiler
(简记CC)是 google 去年推出的一款 javascript 压缩工具,取得了比老牌压缩工具 yui compressor
(简记YC) 更高的压缩比,CC 相对于 YC 具备更多的语义分析
能力, 根据参数具备三个等级的压缩代码能力
:
white-space-only : 只去除源码中的空格
simple-optimization : 对应于 YC 能力,对局部变量名字进行缩短。
advanced-optimization
: CC 独有,这个等级会进行函数内联
,变(常)量提取,执行流程优化等传统编译器前端所做的事情,而对于 javascript ,则会进行激进的属性名缩短,以及对象平坦化操作。这也是导致使用该级优化较少的主要原因。
具体 CC 与 YC 比较 可以见: YC VS CC By Lifesinger
实践:
近期整理 kissy editor
的核心代码,使用 CC 的高级模式编译后,比起简单模式效果显著:
高级模式
比起简单模式节省了17k,17.5% !
当然使用 CC 的高级模式是需要对代码进行一些调整的
1.尽可能多标注
由于 javascript 是一种弱类型语言,而CC 要全面优化的话不可避免需要知道一些类型信息,这些信息就只能通过标注(annotation)来传递给 CC,可以通过 @constructor 标志构造器,@type 标志变量类型,@param,@return 标志函数相关等等。
2.区分对象属性引用方式
javascript 对象属性有两种引用方式 : obj.propertyName 与 obj["propertyName "] ,语言规范来说是没有区别,但是 CC 在优化过程中会对 obj.propertyName 进行 变量名以及属性名缩短,例如:
obj.propertyName -> x.a
这样的话,当需要保持属性名不变,例如(外部引用或配置传入,读取),则要谨慎选择。
使用 obj["propertyName "] 也是 CC 推荐的暴露 (export) 外部api的方法
,将实例以及构造器上的静态方法开放给外部程序调用。
Constructor["api"]=Constructor.api;
Constructor.prototype["api"]=Constructor.prototype.api;
也可参考CC建议
,写个工具方法 extern :
/**
* extern for closure compiler
*/
function extern(obj, cfg) {
for (var i in cfg) {
obj[i] = cfg[i];
}
}
extern(Constructor, {
"api1": Constructor.api,
"api2": Constructor.ap2
})
3.申明外部类库
CC 推荐类库与应用整体编译,但是现实中往往可能类库本身都不能与 CC 兼容,这时就需要使用类似 C 头文件的类库申明文件,来告诉 CC 使用的类库api,防止对调用类库的代码进行优化。
例如:可以提供 kissy 的类库声明文件 kissy.js
,使用时,命令行加入 --externs kissy.js
var KISSY={
augment:function(){},
merge:function(){},
extend:function(){},
namespace:function(){},
guid:function(){},
one:function(){},
all:function(){},
log:function(){},
trim:function(){},
.......
而这也是 CC 避免对浏览器以及语言级 api 优化的重要措施,例如 语言规范 api 声明
,浏览器 api 声明
.....
原理与优化流程:
占位!希望能读懂CC 源码
总结:
使用 CC 的好处显而易见,不仅压缩了代码大小,而且同时CC会做多种已被证实的最佳优化,可减少后期手工优化的繁琐,但是不便之处也很明显,代码必须根据 CC 的需求重新整理,明显的:禁用 with,eval
,不明显的:区分属性访问以及申明外部类库,并且要时刻注意自己导出的外部应用接口。
- 大小: 9.5 KB
分享到:
相关推荐
closure-compiler-v20170521.jar,以及一个.chm使用说明:‘Getting Started with the Closure Compiler Application’,‘Advanced Compilation and Externs’,‘Understanding the Restrictions Imposed by the ...
Closure Compiler exe 根据[在项目中使用Google Closure Compiler](http://www.cnblogs.com/JeffreyZhao/archive/2009/12/09/ikvm-google-closure-compiler.html)
Closure Compiler是用来编译JavaScript的编译器,除了像最常见的JavaScript的压缩机提供的功能,它还会对程序进行分析,把不需要的部份移除,减少的JavaScript程序的大小及提升效率。
NULL 博文链接:https://maidou80.iteye.com/blog/1096203
使用Google Closure Compiler js压缩
google closure compiler js混淆压缩工具方便无法访问google的朋友们下载
Google提供的开源的javascript压缩加密工具。 机器上装java,命令行运行即可。 java -jar compiler.jar --js hello.js --js_output_file hello-compiled.js
Google提供的开源的javascript压缩加密工具。机器上装java,命令行运行即可。java -jar compiler.jar -js hello.js -js_output_file hello-compiled.js
eval方法所以造成无法通过google closure compiler编译
js代码的压缩与混淆: –charset :指定输入输出文件的字符集,缺省预设UTF-8作为输入文件的字符集,US_ASCII做为输出文件的字符集。 –debug:开启调试选项 –help:输出帮助信息 ...
closure-compiler-npm, 用于管理和记录关闭编译器的包,通过npm使用 google-closure-compiler 用闭包编译器检查。编译。优化和压缩 Javascript这个库跟踪发布到 npmjs.org 和相关插件的相关问题。 任何与插件无关的...
利用Closure Compiler通过Rollup缩小和优化JavaScript
capture-replay-framework.zip,该框架通过捕获真实数据将测试数据生成提升到一个新的层次。而不是
用谷歌的closure-compiler + maven-antrun-plugin
Google 提供的 Closure Compiler (CC) 可作为 Web 应用程序使用,也可作为命令行 Java jarfile 下载。 此文件可用于运行您自己的编译。 但是,要以这种方式使用编译器,您必须将所有 javascript 文件名键入(或粘贴...
通常,Closure Compiler将产生比其他项目更好的缩小效果,但是从历史上看,它更难以使用。 该插件的目的是减少这种摩擦。 安装 npm install @ampproject/rollup-plugin-closure-compiler --save-dev 用法 从汇总...
闭包编译器是一个让javascript下载和运行更快的工具。它是一个真正的javascript编译器。它不是从源语言编译成机器代码,而是从javascript编译成更好的javascript。它解析你的javascript,分析它,删除死代码,重写并...
下面的软件是Closure Javascript Framework,它是一组插件,可以与maven结合使用,在JavaScript代码上执行Google Closure Compiler。 该框架允许扩展和模块化。 更多信息请参考位置网站: : Maven 文档请参考: :...
导泻 用于和类型表达式的 JavaScript 解析...// Closure Compiler parsing const type = '!Object' ; let parsedType ; try { parsedType = catharsis . parse ( type ) ; // {"type":"NameExpression,"name":"Objec