Pourquoi les modules RequireJS AMD concaténés ont-ils besoin d'un chargeur?

Question

Nous aimons RequireJS et AMD au cours du développement, où l'on peut modifier un module, appuyez sur recharger dans notre navigateur, et de voir immédiatement le résultat. Mais quand vient le temps de concaténer nos modules dans un fichier unique pour un déploiement en production, il n'y a apparemment un AMD chargeur, toujours actuelle, de savoir si ce chargeur est RequireJS lui-même ou son petit partenaire "amande", comme expliqué ici:

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

Ma confusion est: pourquoi un chargeur nécessaires? Sauf si vous avez des circonstances très exceptionnelles, il est nécessaire pour vous de faire require() les appels à l'intérieur de vos modules, il semblerait qu'une série de modules AMD pourrait être concaténés sans un chargeur de présenter à tous. Le plus simple serait par exemple une paire de modules comme suit.

ModA.js:

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

ModB.js:

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

Compte tenu de ces deux modules, il semble qu'un concatenator pourrait simplement produire le texte suivant, et pas surcharger le serveur de production ou d'un navigateur avec le surplus de bande passante ou de calcul requis par RequireJS ou d'Amande.

J'imagine un concatenator qui produit (et je suis en utilisant chevron-citations «,» pour montrer où les extraits de deux modules ci-dessus ont été insérés):

(function() {
    var ModA = «function() {
        return {a: 1};
    }»();
    var ModB = «function(A) {
        return {b : 2};
    }»(ModA);
    return ModB;
})();

Ce, pour autant que je peux voir, serait de reproduire correctement la sémantique de la DMLA, avec un minimum de superflu et de la colle JavaScript. Est-il une telle concatenator disponible? Si non, en voudrais-je être un imbécile pour penser que je devrais écrire un sont il n'y a vraiment très peu de bases de code qui consistent en de simples et propres modules écrit avec define() et que jamais besoin de plus d' require() les appels à l'intérieur que le coup d'envoi plus tard asynchrone extrait de code?

Answer 1

Un AMD optimiseur a la portée d'optimiser plus que le nombre de fichiers à télécharger, elle permet également d'optimiser le nombre de modules chargés en mémoire.

Par exemple, si vous avez 10 modules et peut les optimiser pour 1 fichier, alors vous avez vous-même sauvé 9 téléchargements.

Si Page1 utilise tous les 10 modules de mieux. Mais que faire si Page2 utilise seulement 1? Un AMD chargeur peut différer l'exécution de l'usine de la fonction " jusqu'à ce qu'un module est - require'd. Par conséquent, Page2 déclenche seulement une seule usine de fonction à exécuter.

Si chaque module consomme 100 ko de mémoire au cours d' require'd, puis un AMD cadre d'exécution de l'optimisation permettra également de nous sauver de 900 ko de mémoire sur la Page2.

Un exemple de cela pourrait être un "Sujet" Boîte de dialogue style. Où l'exécution est retardée jusqu'à la dernière seconde, car il ne sera pas accessible dans 99% des cas. E. g. (en loose jQuery syntaxe):

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

Vous économisez les frais de création de la JS objets et DOM associé à la "Boîte" a Propos de " jusqu'à ce que vous êtes sûr qu'il est nécessaire.

Pour plus d'info, voir le Délai d'exécution définit jusqu'à la première exiger requirejs pour prendre sur cette.

Answer 2

Le seul avantage réel réside dans l'utilisation de modules dans plusieurs sections, ce qui permet de mettre en cache les modules indépendamment.

Answer 3

J'avais le même besoin, j'ai donc créé un "compilateur" AMD simple à cette fin. Vous pouvez l'obtenir à https://github.com/amitayh/amd-compiler

S'il vous plaît noter qu'il a beaucoup de fonctionnalités manquantes, mais il fait le travail (au moins pour moi). N'hésitez pas à contribuer à la base de code.

Answer 4

Au cas où vous compileriez votre code avec require.js dans un seul fichier volumineux pour la production, vous pouvez utiliser almond.js pour remplacer complètement require.

Almond ne gère que la gestion des références de modules et non le chargement lui-même, qui n’est plus nécessaire.

Attention aux restrictions imposées par amande pour travailler

Answer 5

Il n'ya aucune raison pourquoi il ne pouvait pas être un outil de construction tels que celui que vous proposez.

La dernière fois* j'ai regardé l'optimiseur de sortie, il a converti les modules de nommer explicitement les modules, et ensuite concaténées ensemble. Elle a invoqué exiger de lui-même pour s'assurer que l'usine de fonctions ont été appelées dans le bon ordre, et que le bon module d'objets ont été passés autour. Pour construire un outil comme vous le souhaitez, vous devez explicitement linéariser les modules -- pas impossible, mais beaucoup plus de travail. C'est probablement pourquoi il n'a pas été fait.

Je crois** que l'optimiseur a une fonction pour inclure automatiquement exiger de lui-même (ou d'amande) dans le construit de fichier, de sorte que vous n'avez besoin que d'un seul téléchargement. Qui serait plus grande que la sortie de l'outil de génération que vous voulez, mais sinon la même chose.

Si il y avait un outil de construction qui a produit le genre de sortie que vous demandez, Il aurait dû être plus prudent, dans le cas de la machine synchrone require, l'utilisation de l' exports au lieu de retour, et tout autre CommonJS fonctions de compatibilité.

*C'était il y a quelques années. En 2010, je crois.

**Mais n'arrive pas à le trouver dès maintenant.