爲什麼級聯的RequireJS AMD模塊需要加載器？

我們喜歡RequireJS和AMD在開發過程中，我們可以編輯模塊，在瀏覽器中重新加載，並立即看到結果。但是當需要將我們的模塊連接成單一文件進行生產部署時，顯然必須有AMD加載器，無論該加載器是RequireJS本身還是其較小的合作伙伴「杏仁」，如下所述：爲什麼級聯的RequireJS AMD模塊需要加載器？

http://requirejs.org/docs/faq-optimization.html#wrap

我的困惑是：爲什麼裝載機是必需的？除非你有非常特殊的情況使得你需要在你的模塊內部調用require()調用，否則看起來一系列的AMD模塊可以在沒有加載器的情況下連接在一起。最簡單的例子可能是一對模塊，如下所示。

ModA.js：

define([], function() { 
    return {a: 1}; 
});

ModB.js：

define(['ModA'], function(A) { 
    return {b : 2}; 
});

鑑於這兩個模塊，似乎一個連接符可以簡單地產生下面的文本，而不是負擔生產服務器或瀏覽器帶有RequireJS或Almond所需的額外帶寬或計算。

我想，產生一個級聯器（和我使用字形引號«»以示出從兩個模塊的片段上面已插入）：

此，到目前爲止我可以看，會正確地重現AMD的語義，至少有額外的粘連JavaScript。有沒有這樣的連接器？如果沒有，我是否會傻傻地想我應該寫一個 - 是否真的有很少的代碼庫由簡單和乾淨的模塊組成，用define()編寫，並且在那之後不需要進一步調用require()進行異步取代碼？

來源

2012-06-11 Brandon Rhodes

你是如何解決這個問題的？我發現使用杏仁，min文件大3k，然後連接文件（9K vs 6K）。 – Naor

AMD優化器的優化範圍超過了要下載的文件數量，它還可以優化內存中加載的模塊數量。例如，如果您有10個模塊，並且可以將它們優化爲1個文件，那麼您已經保存了9次下載。

如果Page1使用全部10個模塊，那就太好了。但是，如果Page2只使用1呢？ AMD加載程序可以延遲「工廠功能」的執行，直到模塊爲require'd。因此，Page2只會觸發一個「工廠功能」來執行。

如果每個模塊在require'd之間消耗100kb的內存，那麼運行時優化的AMD框架也將在頁面2上節省900kb的內存。

這可能是一個「關於Box」樣式對話框的例子。它的執行被推遲到最後一秒，因爲它在99％的情況下不會被訪問。例如。（鬆散的jQuery語法）：

aboutBoxBtn.click(function() { 
    require(['aboutBox'], function (aboutBox) { 
     aboutBox.show(); 
    } 
});

您保存創建JS對象和DOM相關的與「關於框」的費用，直到你確信這是必要的。

欲瞭解更多信息，請參閱Delay executing defines until first require for requirejs採取此。

來源

2012-06-11 23:05:25

有趣！所以，如果我明白你在說什麼，你正在定位創建對象並修改DOM *的代碼僅僅是作爲被要求的副作用*，那是正確的嗎？我不會想到這一點，如果這種做法很常見，那麼你可能會碰到JS編碼器喜歡在生產中使用AMD加載器的原因。可能是因爲我的Python背景，我的代碼在導入時沒有執行任何代碼 - 它只是返回一個充滿函數的對象，以便在最終需要它們的副作用時進行調用。 –

你關於內存使用的例子經常被I/O開銷所困惑 - 對於類似於盒子的東西，它看起來像是一次加載，但推遲初始化，這樣可以節省內存和設置，而不會產生大的交互延遲命中。 –

@Chris，我同意你的觀點，但只想提出一個在運行時出現AMD加載器的例子。我可能會擔心啓動時執行的代碼太多，而您可能會擔心延遲。除了微不足道的情況之外，我認爲在性能方面不存在一成不變的局面。在我的例子中不會有延遲點擊，因爲所有的JS已經被加載，只是沒有'執行'。 –

唯一真正的好處是如果你跨模塊使用模塊，所以獨立地緩存模塊是有好處的。

來源

2012-06-11 23:26:42

如果您將帶有require.js的代碼編譯成單個大文件進行生產，則可以使用almond.js來完全替換require。

杏仁只處理模塊引用管理而不是加載本身不再需要。

小心的restrictions杏仁爲了工作

來源

2012-11-16 09:26:56

強加沒有理由爲什麼不能是構建工具，如您提出一個。

上一次*我查看了優化器的輸出，它將模塊轉換爲明確命名的模塊，然後將它們連接在一起。它依賴於要求自己確保工廠函數按照正確的順序被調用，並且正確的模塊對象被傳遞。要想像你想要的那樣構建一個工具，你必須明確地對這些模塊進行線性化 - 這不是不可能的，而是要做更多的工作。這可能是爲什麼它沒有完成。

我相信**優化器具有自動將自身包含到構建文件中的功能，因此您只需要下載一次即可。這將比你想要的構建工具的輸出大，但其他方面相同。

如果有一個生成工具可以生成您要求的輸出結果，那麼對於同步require，使用exports而不是返回以及其他任何CommonJS兼容性特徵。

*那是幾年前。 2010年，我想。

**但似乎無法找到它的權利。

來源

2013-01-11 17:35:05

我有同樣的需求，所以我創建了一個簡單的AMD「編譯器」，就是這麼做的。你可以得到它在https://github.com/amitayh/amd-compiler

請注意，它有許多功能缺失，但它做的工作（至少對我而言）。隨意貢獻給代碼庫。

來源

2014-05-10 10:32:08 amitayh

爲什麼級聯的RequireJS AMD模塊需要加載器？

回答

相關問題