javascript 优化和缩小 vs. gzipping

Question

我注意到 minifier 在原型(prototype) javascript 中表现不佳，因为如果它们以此开头，它们不会替换任何方法或属性。例如:

// unoptimized 182 bytes
myClass.prototype.myFunction = function(){
    this.myElementDom.style.backgroundColor='#000';
    this.myElementDom.style.color='#FFF';
    this.myElementDom.style.borderColor='#DDD';
}

// 168 bytes = 92% of unoptimized, YUI compressed
myClass.prototype.myFunction=function(){this.myElementDom.style.backgroundColor="#000";this.myElementDom.style.color="#FFF";this.myElementDom.style.borderColor="#DDD"};

// optimized 214 bytes
// set a replaceable local scope variable and reduce 2 variable 
// lookups at the same time
// file-size in the development version doesn't matter, so we can even increase it 
// to preserve readability
myClass.prototype.myFunction = function(){
    var myElementDomStyle = this.myElementDom.style
    myElementDomStyle.backgroundColor='#000';
    myElementDomStyle.color='#FFF';
    myElementDomStyle.borderColor='#DDD';
}

// 132 bytes = 72.53% of unoptimized, YUI compressed
myClass.prototype.myFunction=function(){var a=this.myElementDom.style;a.backgroundColor="#000";a.color="#FFF";a.borderColor="#DDD"};

Hurray，节省了 19.47%... 不 ...在启用 gzip 的情况下发布脚本时，未优化的 YUI 压缩版本加载 130 字节(= 71.42% 来自未优化)并且显然比优化的 YUI 节省更多134 字节的压缩版本(=73.63% 来自未优化)...在考虑压缩的工作原理后可能很明显，但现在该怎么做？首先进行这种微优化和较小的压缩证明使用 gzip 更大的文件大小是合理的......因为您可以通过这种优化轻松地降低代码的可读性和可维护性。

所有信息根据 http://refresh-sf.com/yui/

Answer 1

代码可读性不应该考虑在内——您应该只在生产服务器上进行压缩，并在未压缩的代码上进行开发。不要微优化你的变量和函数名称，你几乎肯定会牺牲代码的可读性以获得几乎为零的可用性增益——你谈论的是一个几 KB 的文件，它将被下载一次并缓存。

至于是缩小和 gzip 还是只 gzip - 以产生更小的整体文件大小为准。