JavaScript優化和縮小與gzipping

我注意到縮小器不會用原型javascript執行那麼好，因爲如果它們以此開始，它們不會替換任何方法或屬性。例如：JavaScript優化和縮小與gzipping

// 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"};

華友世紀，19.47％保存...不要...發佈用gzip腳本啓用，未優化，YUI壓縮版本加載與130個字節（= 71.42％來自未優化），顯然在收益比優化後的YUI壓縮版本節省了134個字節（=未優化的73.63％）......在考慮壓縮是如何工作的時候可能是顯而易見的，但現在要走了嗎？首先做這種微型優化和較小的壓縮，用gzip證明更大的文件大小......因爲通過這種優化，您可以輕鬆地使您的代碼更少可讀性和可維護性。

一切按http://refresh-sf.com/yui/

來源

2012-04-15 Marcello di Simone

您可以使用google closure minifier。 'gzip' +'minify'仍然比只有'gzip'好。 – kirilloid 2012-04-15 23:15:45

不是第二個例子更多關於在運行時減少DOM查找，而不是尋找空間節省？ – 2012-04-16 11:22:22

代碼的可讀性不應該接觸到它的信息 - 你應該只涅槃生產服務器和非精縮代碼開發。不要微調優化你的變量和函數名稱，你幾乎可以肯定會犧牲代碼的可讀性，使得可用性幾乎爲零 - 你正在討論幾KB的文件，它將被下載一次並緩存起來。

至於是否縮小和gzip或只是gzip - 做任何產生較小的整體文件大小。

來源

2012-04-15 23:00:48 rgvcorley

無論如何，182字節的代碼不會縮小或壓縮太多。縮小工作通過消除空白（在你的五行代碼中只有16個字節）和縮短函數，變量和屬性名稱來實現，在這種情況下，由於範圍的原因它不能做到這一點。壓縮通過發現重複序列並消除它們而起作用。在你的五行代碼中沒有足夠的文本可以找到很多重複。

嘗試縮小和壓縮50或100或更多行代碼，您將看到更加引人注目的結果。而且，正如@rgvcorley所建議的那樣，您應該專注於在開發環境中使代碼易讀易維護，並將較小的文件大小細節留給構建過程和Web服務器。

來源

2012-04-15 23:12:28

有一件事不排除另一件事：你可以做最小化和gzipping JS文件（通常在web服務器級別發生gzipping）。我認爲它會提供最好的結果。最小化和壓縮在較大的文件上效果更好。

除了讓JS小我想看看：

合併JS文件分割成一個縮小的文件，以減少HTTP的請求數
優化HTTP緩存設置
把JS到CDN減少下載時間
使用公共CDN爲一些常見的JS庫例如jQuery的，所以它更容易從用戶的本地緩存
添加JS文件和HTML頁面

年底採取檢查您的網站http://www.webpagetest.org/讓報什麼其他的東西可以改善

欲瞭解更多信息，我會推薦閱讀High Performance Web Sites的書。它涵蓋了nany場景，即使一些簡單的更改也可以顯着改善頁面加載時間。

來源

2012-04-15 23:15:03

我認爲我的問題沒有明確的措詞，我沒有計劃將我的代碼發佈到未知。我正在閱讀你指出的這本書，這是我試圖減少變量查找和優化縮小的原因:-) – 2012-04-16 09:10:27

JavaScript優化和縮小與gzipping

回答

相關問題