javascript文件存儲

我在我的項目頁面的header.php中存儲了JavaScript文件。加班這已經增長到很多文件。需要高級會員誰可以指導我如何存儲這些幫助？我在網上搜索找不到任何東西。所以這是我的最後一站。這些應該存儲在header.php（所以我在做什麼是正確的？）。這些應該單獨存儲在使用它們的.php頁面上？還是有另一種更好，更有效的方法來做到這一點？（我有一些原型和Scriptaculous文件還）javascript文件存儲

<script type="text/javascript" src="javascript/prototype.js"></script> 

<script type="text/javascript" src="javascript/scriptaculous.js"></script> 

<script src="javascript/jquery-1.6.1.min.js"></script> 
<script type="text/javascript"> 
    jQuery.noConflict();   
</script> 

<script type="text/javascript" src="javascript/jquery.colorbox.js"></script> 

<script type="text/javascript" src="javascript/friends.js"></script> 

<script type="text/javascript" src="javascript/site.js"></script> 

<script type="text/javascript" src="javascript/search.js"></script> 

<script type="text/javascript" src="javascript/settings.js"></script> 

<script type="text/javascript" src="javascript/inbox.js"></script> 

<script type="text/javascript" src="javascript/profile.js"></script> 

<script type="text/javascript" src="javascript/color_picker.js"></script> 

<script type="text/javascript" src="javascript/load_more.js"></script> 

<script type='text/javascript' src='javascript/jquery.bgiframe.min.js'></script> 

<script type='text/javascript' src='javascript/jquery.Queue.js'></script> 

<script type='text/javascript' src='javascript/jquery.autocomplete.js'></script>

來源

2011-07-26 Gurnor

你需要多少內聯？如果您正在等待所有呼叫的'document.ready'，請將所有腳本放在''之前，以便在加載和執行腳本時不會減慢加載時間。 – zzzzBov

@zzzzBov inline你的意思是在標題內？你還在說這些東西放在元素的什麼？ Header.php文件？ – Gurnor

我假設你的意思是將腳本放在頁面的head元素中。你沒有提及'php'作爲一種語言。通過'inline'，我的意思是在它們影響的內容之後立即執行的任何腳本。 ''我的意思是在'body'元素的結束標記之前。 – zzzzBov

您正在加載15個腳本，其中包括3個庫！這是完全矯枉過正，並會減慢你的頁面。你永遠不應該有一對以上的Javascript文件：每個額外的文件都會產生一個額外的HTTP請求，這是緩慢頁面的頭號原因。

絕對最低限度，您應該將所有文件合併爲一個。您可以使用Google's Closure Compiler來做到這一點，這也將使代碼最小化。

但是，更大的問題是您同時使用3個不同的庫。我猜你在互聯網上發現了一些漂亮的腳本，比如燈箱，但每個腳本都使用不同的庫。你當然可以將你的代碼分成3個文件，每個庫和它們的插件（即所有的jQuery文件在另一個文件中，Scriptaculous在另一個文件中），並且每個頁面只調用一個。

但是，我建議從頭開始，並選擇選擇一個庫，然後找到該庫的插件。 jQuery是最流行的，你可能會找到相應的插件。將所有內容合併成一個Javascript文件並將其包含在每個頁面上。這樣，用戶只有一個要下載的文件，這些文件將被緩存用於以後的請求。

來源

2011-07-26 09:40:40 DisgruntledGoat

主要的好建議，但不一定是真的;如果您的.js服務器的緩存時間很長，並且被告知不要重新驗證，則不會爲它們發送HTTP請求，因此有許多腳本標記並不是真正的問題。不過，我非常懷疑OP在這裏做了正確的緩存控制，所以這可能是他們的問題。 –

@El Yobo：但你仍然有初始頁面加載的15個請求，這是一個很多！這些插件的可能性不會超過幾個kB，因此HTTP請求佔整個下載時間的很大一部分。 – DisgruntledGoat

的Javascript模塊化真的是一個PITA。

我個人使用Dojo工具包中的模塊處理功能，但也有獨立的模塊系統，如RequireJS也可以這樣做。（我不知道JQuery-land中的「傳統」解決方案是什麼）

如果你不想或不能使用這些模塊處理庫中的一個，你將需要構造所有的所以對於每個功能，您需要在每個需要使用它的頁面上包含其腳本標記（並且按照正確的順序，如果存在依賴關係）。

如果時間太長加載所有的腳本，還有你可以考慮做一些性能相關的東西：

合併相關的腳本的一些羣體納入單一的，大的，文件。這將減少對服務器的請求數量。（並減少HTML中腳本標記的數量，作爲獎勵）
將腳本標記放在<body>而不是<head>的末尾。通過這種方式，瀏覽器至少可以在停止加載腳本之前先呈現頁面的其餘部分。

來源

2011-07-26 04:31:56 hugomg

如果性能是一個問題，我還會考慮壓縮和g-ziping您的腳本。 – Kieran

首先關閉給定頁面上的所有頁面，只加載那些需要的js文件。

其次它對我們最好RequireJS如果你有太多的js文件。

來源

2011-07-26 06:36:36

javascript文件存儲

回答

相關問題