通過AJAX獲取Javascript

Question

我想知道如果我通過AJAX請求獲取所有腳本（不是供應商），以及它有什麼好處或壞處。瀏覽器緩存響應或服務器會發送我的腳本與每個請求，如果用戶從未去過我的網站？

性能方面會比在腳註中存儲所有腳本更好。

Answer 1

通過AJAX獲取腳本有點混亂，您可以使用JavaScript創建額外的腳本元素來將額外腳本加載到頁面中 - 這也可以異步完成，因此它不會阻止呈現或下載這一頁。看看比如下面的例子：

var script = document.createElement('script'); 
script.src = 'myscript.js'; 
document.head.appendChild(script); 

它創建了一個新的腳本元素，指定源和它附加到文件的head部分。如果將其添加到文檔的末尾，那麼腳本將被下載而不會阻止頁面加載。

這個簡單的想法是所有（我知道的）前端JS依賴管理的基礎 - 所請求的頁面只下載它需要的資源的想法。你可能聽說過JS模塊定義，比如AMD和CommonJS，這是一個很大的話題，所以我建議讀一下Addy Osmani's "Writing Modular JavaScript With AMD, CommonJS & ES Harmony" article。

在回答他們是否會被緩存時，答案是肯定的 - 一般來說 - 儘管緩存取決於服務器和用戶瀏覽器上的許多因素。個別請求仍然需要在每個後續頁面加載時進行，這可能比片上連接上的一個大個人文件慢。這個決定實際上取決於用戶如何訪問您的網站，以及開發者的創作和維護是否有一點微不足道的速度下降。你可以隨時去找前者。

Answer 2

從本質上講，默認情況下，<script>是同步拉動數據到你的頁面。當腳本放在頭部時，這可能是一個問題，因爲它可能是顯示您身體內容的攔截器。

通過ajax異步拉動javascript可能通常在滿足特定次要條件時非常方便，即大多數用戶不會首先使用您的腳本。假設您有一個頁面，並且您應該以管理員身份登錄，則需要添加一些腳本來處理您的管理界面。或者這樣。

但是一般來說，在Ajaxing JavaScripts中沒有真正的優勢，並且您應該想要避免錯誤的依賴關係（比如您的腳本比您的jQuery庫早），只需堅持已經最優化的解決方案：將您的javascripts作爲關閉車身標籤的最後一件事。

請注意，HTML5草案中有新的async attribute，它可以異步獲取腳本（（因此加速理論上的速度），即使不使用AJAX魔術也是如此，它只支持現代瀏覽器，支持IE9和老年人退出遊戲。

希望它有幫助！