In einer Webanwendung, an der ich arbeite, gibt es drei Arten von Skripten (dasselbe gilt für Stylesheets):
- Die auf jeder einzelnen Seite benötigten (zB jquery)
- Diese werden auf mehreren Seiten benötigt, aber nicht auf allen (z. B. eine Lightbox-Bibliothek, die auf Seiten verwendet wird, auf denen vom Benutzer hochgeladene Bilder angezeigt werden).
- Diejenigen, die auf einer einzelnen Seite benötigt werden (z. B. etwas, das für die Funktionalität dieser Seite spezifisch ist)
Sollte jede Seite ein eigenes Bundle haben, das alle benötigten Skripte bündelt? Oder sollte jeder Skripttyp ein eigenes Bundle sein (dh eine Seite kann 3 Bundles laden - essentialScripts.js, mediaLibraries.js und pageSpecificScripts.js)? Oder gibt es einen besseren Ansatz, den ich nicht kenne?
Was ist die beste Vorgehensweise zum Bündeln dieser Skripte und welche Vor- und Nachteile haben verschiedene Ansätze?
(Ich bin nicht sicher, wie relevant dies sein wird, aber das Projekt, an dem ich arbeite, verwendet die ASP.NET MVC-Bündelung. Um die Dinge einfacher zu halten, nehmen wir an, dass keine der Dateien von einem CDN eines Drittanbieters stammt Sie werden alle vom selben Ort geladen und der Kunde hat keine Möglichkeit, andere Websites zu besuchen.)
Antworten:
Für komplexe Anwendungen ist es sinnvoll, die von Ihnen vorgeschlagene Aufteilung vorzunehmen. Ihre gemeinsamen Bits, insbesondere externe Bibliotheken, ändern sich viel seltener als Anwendungscode. Sie sind also Hauptkandidaten für das Caching. Alles zusammen zu bündeln verhindert das. Andererseits fügen sie zusätzliche HTTP-Anforderungen hinzu. Das würde die anfängliche Erfahrung ein bisschen weniger schön machen. Ein gängiges Muster besteht darin, externe Bibliotheken in einem Bundle und Anwendungscode in einem anderen zu haben. Besonders wenn letzteres kleiner ist und viel zwischen Seiten und Ansichten geteilt wird, ist dies sinnvoll.
Dies ist jedoch ein sich bewegendes Ziel. Die Best Practices von heute sind die Anti-Patterns von morgen. Der Rat ändert sich in einer Welt, in der http / 2 üblich ist oder in der clientseitige Module von allen gängigen Browsern unterstützt werden.
quelle