2014-10-02 192 views
12

我看到一些代碼here說了這些變量聲明:這段代碼如何優化縮小?

var equestAnimationFrame = 'equestAnimationFrame', 
    requestAnimationFrame = 'r' + equestAnimationFrame, 

    ancelAnimationFrame = 'ancelAnimationFrame', 
    cancelAnimationFrame = 'c' + ancelAnimationFrame 

根據頁面上的評論,這是提高微小,但我無法弄清楚如何。有人能告訴我嗎?謝謝。

+0

我認爲它的,因爲後來他們用'ancelAnimationFrame',如'窗口[供應商+「R」 + equestAnimationFrame]' – matsjoyce 2014-10-25 10:02:31

回答

22

這不是爲了提高縮小率 - 所涉及的代碼是requestAnimationFrame填充。這意味着它將嘗試不同的供應商前綴。因此有時代碼將爲"requestAnimationFrame"(小寫r),有時還會附帶供應商前綴,如msRequestAnimationFrame

由於這個原因,它是動態構建的,"equestAnimationFrame"總是存在,但它可能以"r""R"爲前綴。

的「提高微小」部分是因爲不是寫:

var requestAnimationFrame = window.requestAnimationFrame || 
          window.msRequestAnimationFrame || 
          window.mozRequestAnimationFrame || 
          window.webkitRequestAnimationFrame || 
          window.oRequestAnimationFrame || 

他們運行一個關於["ms","moz","o", "webkit"]循環,並嘗試前綴。這最多可以節省幾個字節。

這裏是代碼,我認爲這是更清晰,做同樣的事情:

var base = "equestAnimationFrame" // the base string 
var alternatives = window["r"+base] || // try the basic option first 
['moz', 'ms', 'o', 'webkit'].map(function(x){ 
    return x+"R" + base; // all the options 
}).filter(function(x){ // check if in window 
    return x in window; 
})[0]; 
+10

在所有的誠實,我認爲「unminified」版本更具可讀性。 – Ajedi32 2014-10-02 14:27:11

+4

@ Ajedi32我完全同意。此外,假設代碼是gzip,即使它不是 - 我懷疑這會對文件大小產生重大影響。有時候明顯的解決方案是更好的解決方案 – 2014-10-02 15:31:05

+1

如果您正在爲大量屬性執行此操作,那麼節省的大小會加起來並變得很重要。 – OrangeDog 2014-10-02 16:42:12