Bündeloptimierung in verteilter Softwarearchitektur

Wir haben eine Architektur, in der eine große Anwendung in mehrere Angular-Anwendungen aufgeteilt wird, die von verschiedenen Teams mit unterschiedlichen Bereitstellungszeitplänen verwaltet werden. Diese separaten Angular-Anwendungen in einem ASP.NET-Kontext werden auf einem Server bereitgestellt und als eine große Anwendung ausgeführt. Jede Anwendung wird in einem separaten App-Pool bereitgestellt, und alle haben denselben Layout- und Framework-Code.

Jede Anwendung würde ein Bundle verwenden, das mit dem AOT-Compiler und einem Modulbündler (Rollup oder Webpack 2) optimiert wurde. Jede Anwendung würde auch zentralisierten Javascript-Code verwenden, der in der großen Anwendung (Framework-Code) zentralisiert werden muss. Dieser Code würde auch Winkelkomponenten verwenden und Dinge wie eine zentralisierte Layoutkomponente, mehrere eckige Dienste, die Web-API-Aufrufe enthalten, usw. umfassen. Daher würde jede Anwendung denselben Framework-Code verwenden.

Das Ziel ist auch, dass bei einer Änderung dieses Framework-Codes keine einzelne Anwendung aktualisiert und erneut bereitgestellt werden muss.

Der Standardweg, den ich sehe, ist, dass es2015 Importe verwendet werden und dass ein Modulbündler die Importe interpretiert und nur den notwendigen Code in das Modul einfügt (Tree Shaking). Meistens ist auch das Angular Framework, das Sie benötigen, im Paket enthalten (keine Verwendung von CDN). Aber in diesem Fall gibt es 3 Parteien, die den Code liefern:

• Winkel- und anderer Herstellercode
• Der zentralisierte benutzerdefinierte Framework-Code, der für alle Anwendungen verwendet wird, die ebenfalls Angular verwenden und auch ein Bundle bereitstellen
• Die Anwendung selbst bietet ein Bündel

Wie würden Sie die Pakete aufteilen und optimieren?

• Erstellen Sie ein separates Bundle mit allen Angular / Vendor-Komponenten, die der zentralisierte Framework-Code und die Anwendung verwenden müssen Angulares Zeug würde vom Hauptbündel ausgeschlossen werden
  • Verwenden Sie einen CDN-ähnlichen Weg, um die benutzerdefinierten Framework-Funktionen zu zentralisieren und auf dieses Paket zu verweisen (ohne eckigen Code im Paket)
  • Du würdest also mit so etwas enden:

<script src="vendor-bundle.js"></script>
<script src="/central-location/frameworking-bundle.js"></script>
<script src="app-bundle.js">/script>;

Was ist der beste Ansatz in diesem speziellen Fall? Ich kann keine guten Beispiele für diese Architektur finden.