Require.js何時加載文件？

Question

什麼決定Require.js早期加載什麼文件是必需的？腳本執行後是否立即執行加載？ DOMContentLoaded之後？還有別的嗎？

我正在分析一個頁面，我想優化，而且我經常注意到的一件事是，要求明顯比其他腳本明顯地熄滅，可能是什麼原因？

Answer 1

JRBurke有時會在這裏掛起，所以他會比我更好地回答，因爲我只是做一些假設。

聽起來好像你在你的頁面中使用了多個腳本標記，所以如果我不得不猜測，我會說RequireJS依賴只是比其他腳本標記更簡單的加載。 Here's a whole bunch of info on the load and execute order of script tags。

否則，我對RequireJS的理解是，它會根據需要加載內容。想象一下，你RequireJS標籤如下所示：

<script src="lib/require.js" data-main="main.js"></script> 

如果您main.js文件看起來像這樣：

requirejs.config({ /*conf */ }); 

然後RequireJS加載主文件，它配置RequireJS，並不會僅此而已。後來，你的文件也許一個看起來是這樣的：

/* code, code code */ 
require(
    ['dist/module'], 
    function(distModule){ 
     /* code code code */ 
    } 
); 

在這點，需要將開始發射了請求，以解決任何依賴關係鏈的dist/module。如果在此之前的任何代碼引入了延遲（如等待加載的東西，或者包含在jQuery DOMReady中），RequireJS將不會開始加載模塊，直到所有這些延遲都解決爲止。

---

我的情況有點不同，它可能會提供一些見解。 我只有一個腳本標籤在我的整個應用程序：

<script src="vendor/require.js" data-main="build/app"></script> 

我的主要文件是這樣的：

requirejs.config({ /*conf */ }); 

require(
    ['dist/module1', 'dist/module2'], 
    function(distModule1, distModule2){ 
     /* code code code */ 
    } 
); 

distModule1和distModule2開球加載整個應用程序，並會火了每個請求獲得主視圖所需的內容。當我移動應用程序時，它會觸發請求以獲取後續視圖所需的內容。實際上，我使用r.js whole-project optimizer將所有內容編譯到一個文件中，因此只要加載完成，應用程序就會被加載（300kb左右）。

---

綜上所述，RequireJS 庫是隻要瀏覽器遇到腳本標記加載。以這種方式加載的代碼立即執行。假設我正確理解了RequireJS，庫會立即嘗試加載data-main文件 - 我相信這是異步完成的。

每次遇到模塊，RequireJS都會加載它們asynchronously。你看到的任何延遲都可能與此有關。