4

主要的JavaScript壓縮器和縮小器不處理對象屬性名稱。 (Google Closure,YUI ...)JavaScript壓縮和對象屬性問題

我注意到,根據我們決定爲我們的腳本選擇哪種方式或模式,結果大小有很大差異(gzipped和不gzipped)。例如,爲我們的項目選擇原型模式很可能會生成更大的結果文件(未壓縮,壓縮和gzip)。

下面是用兩個代碼部分恰好做同樣的一點比較:

使用Google Closure compiler壓縮。


原型圖案


變種MyBluePrint =函數(){this.name = 「演示」:

結果通過看所得到的壓縮代碼是很明顯; this.someFunction = function(){alert(「some function」)}; this.someOtherFunction = function(){alert(「some other function」)}; this.showMyName = function(){alert(this.name) }; this.someFunction(); this.someOtherFunction(); this.showMyName()}; new MyBluePrint;


無圖案


變種MyBluePrint =函數(){警報( 「一些功能」);警報( 「一些其他功能」);警報( 「演示」 )}; new MyBluePrint;使用對象屬性



任何不會被壓縮。如:

//function declarations 
this.someFunction = function(){ ... } 

//objects 
var demo = { 
    isActive: 'aaaa'. 
    name: 'aaaa' 
} 

我們是否應該在創建項目時真正考慮這一點? 這不是第一次,而不是有一個對象完整的屬性,我決定使用正常變量只是爲了壓縮多次使用長名稱的屬性。

+1

取決於潛在的節省,並因此取決於代碼的最小化。最終的節省有多大? – tucuxi

+0

你的JSFiddle鏈接是相同的。兩者似乎都是「無模式」的方法。 –

+0

@ChadKillingsworth對不起。更新的鏈接。 – Alvaro

回答

2

Closure-Compiler使用ADVANCED_OPTIMIZATIONS完全重命名屬性名稱。此外,要獲得Closure編譯器的全部功能,您需要告訴編譯器MyBluePrint是使用@constructor註釋的構造函數。另外,你所說的「原型模式」實際上是使用實例方法 - 而不是原型。

這裏的更新的比較:

Closure編譯器可以在許多情況下完全內聯方法使輸出尺寸差異幾乎可以忽略不計。如果您可以使用Closure-compiler與ADVANCED_OPTIMIZATIONS,則應選擇提供最佳可維護性的代碼模式,並讓編譯器處理優化。

然而,所有這些比較基本上沒有意義。要進行實際的GZIP壓縮比較,您需要一個較大的代碼庫。小的代碼片段不能提供準確的表示。