爲不同頁面加載不同的js文件或加載在一起？

第1頁：19 KB的JS
第2頁：26 JS
頁的KB 3：10 kb的JS的
總數：55 kb的JS
的

這些JavaScript文件是非重複，意味着頁面1上所需的JS不需要在頁面2上，而且我的過期頭文件設置爲1個月。

不過我想知道什麼是加載這些文件的最佳方式，我應該爲每個頁面加載單獨的文件還是將這些文件加載在一起？

2011-01-22 Shishant

你可能應該單獨加載它們......
但是，爲了加快速度，你可以做一個技巧：如果你認爲用戶停留了一段時間（我不知道，至少5秒）你的頁面，你可以加載特定頁面的腳本，並在頁面加載後遠程添加其他頁面。通過這種方式，您可以強制客戶端的瀏覽器創建另一個（目前不需要的）js文件的緩存副本，並且因爲在dom對象構建完成後加載它們，所以不會減慢頁面呈現速度。
當文檔完成加載時，您將不得不添加「addScript」函數並進行「addScript」調用。對於第一個js（第一頁），它應該是這樣的：

 
function addScript(jsUrl){ 
    var s = document.createElement('script'); 
    s.setAttribute('type','text/javascript'); 
    s.setAttribute('src',jsUrl); 
    document.getElementsByTagName('body')[0].appendChild(s); 
} 
window.onload = function(){ 
    addScript('mySecondScript.js'); 
    addScript('myThirdScript.js'); 
}

美麗之處在於，當您加載其中一個頁面時，相應的js文件會立即加載，因爲它是從瀏覽器的緩存中檢索的。

來源

2011-01-22 20:58:12

謝謝，我進一步擴展它。我製作了一組js文件，然後根據用戶所在的頁面，首先爲它加載文件，然後在空閒時間休息。 – Shishant 2011-01-22 22:19:19

我會將它們全部混合在一個JS文件中，通過Google的Closure Compiler設置爲「高級優化」，並使用一堆緩存指令加載一次。如果你確實使用了高級的Closure Compiler集，你必須確保HTML文件中沒有嵌入式JavaScript（這通常不是一個好的做法），因爲函數和變量名（甚至全局函數和變量名稱）之後將不會相同。

來源

2011-01-22 20:22:03

55 kb並不是那麼多。但是，當您必須處理第1頁和第3頁代碼時，更新可能會更困難。此外，你有沒有嘗試縮小代碼，聽起來像很大的JavaScript文件。

來源

2011-01-22 20:24:01 qw3n

您描述的方式，你應該分開加載它們。

如果用戶保證導航到所有3頁然後是，將它們合併。如果他們通常導航到一頁，然後加載所有三個是浪費。

也就是說，55k不是那麼大，但是考慮一下移動瀏覽器甚至撥號的影響。

最小化並使用壓縮將JS最大限度地減少，但除非需要才加載文件。

來源

2011-01-22 20:34:47 Dekker500

爲不同頁面加載不同的js文件或加載在一起？

回答

相關問題