Require.js und optimieren durch r.js: Wie finde ich die optimale Möglichkeit, Module für mehrere Seiten zu kombinieren?

Question

Mit Require.js und es funktioniert ziemlich solide.

Allerdings lese ich über Optimierung (http://requirejs.org/docs/optimization.html) mit r.js.

Nach meinem Verständnis bündelt es Top-Level definierte Module in 1 Datei (groß, weil: weniger http-Aufrufe, minimiert).

Das scheint in Ordnung, wenn ich nur 1 Seitentyp definiert, d. H. 1 Satz von erforderlichen Modulen zu laden. An jedem normalen Standort haben Sie jedoch mehrere Seitentypen, die jeweils unterschiedliche Module erfordern.

Jetzt frage ich mich nur, wie clever r.js wirklich ist? Nimmt man die mehreren Seiten (mit unterschiedlichen 'requires') in Kauf, um zu bestimmen, welche Module zusammen verpackt werden sollen, so dass ich nicht mit X-gebündelten Javascript-Dateien für X-Seitentypen lebe, obwohl es erhebliche Überlappungen in den Modulen gibt in jedem dieser gebündelten Skripte enthalten.

Alle Hinweise, die ich dem Optimierer geben muss, wird es automatisch behandelt, etc?

Klärung sehr geschätzt ,.

Answer 1

Was ich verstehe, ist, dass der Optimierer Abhängigkeiten für eine Datei findet, indem er nach require() Aufrufen sucht, und eine Liste dessen erstellt, was er findet. (So ​​findet es nur Abhängigkeiten, die an require() als literale Zeichenfolgen übergeben werden.) Dann wird die Datei mit ihren Abhängigkeiten (rekursiv) in einer Datei kombiniert und minimiert.

Sie können steuern, was in der Konfiguration in ein Modul eingeht. Hier ist ein Beispiel:

({ 

baseUrl: "Website/Scripts", 
dir: "Staging/Scripts", 
modules: [ 
    { name: "main", include: ["Rotator"], exclude: ["jwPlayerDialog"] }, 
    { name: "jwPlayerDialog" } 
], 
paths: { 
    "jquery": "empty:" 
}, 
fileExclusionRegExp: /^\.|Microsoft|modernizr|unobtrusive|\.min\.|\.debug\./ 
}) 

Wenn Sie die Minimierung deaktivieren, können Sie leicht sehen, was in jeder Datei enthalten ist. Ein Modul könnte in mehr als einer Datei enthalten sein. Zum Beispiel wird das Rotator-Modul oben in main.js sein, und es wird immer noch als Rotator.js verfügbar sein.