分布式软件体系结构中的捆绑优化

Question

我们有一个架构,其中一个大型应用程序被拆分为多个Angular应用程序,由不同的团队维护,具有不同的部署时间表 ASP.NET上下文中的这些单独的Angular应用程序部署在服务器上,并作为一个大型应用程序运行.每个应用程序都部署在一个单独的应用程序池中,它们都具有相同的布局和框架代码.

每个应用程序都将使用通过使用AOT编译器和模块捆绑器(汇总或webpack 2)优化的捆绑包.每个应用程序还将使用集中式Javascript代码,这些代码需要集中在大型应用程序(框架代码)中.此代码还将使用Angular组件并包含诸如集中布局组件,多个角度服务以及Web api调用等内容......因此每个应用程序都将使用相同的框架代码.

目标还在于,当框架代码发生更改时,任何单个应用程序都不必再次更新和部署.

我看到的标准方法是使用es2015导入,模块捆绑器解释导入,只将必要的代码添加到模块中(树摇动).大多数情况下,您需要的Angular框架内容也包含在捆绑包中(不使用CDN).但在这种情况下,有3个方提供代码:

• Angular和其他供应商代码
• 所有应用程序使用的集中式定制框架代码也使用Angular并提供捆绑包
• 应用程序本身提供一个捆绑

您将如何分割和优化捆绑包？

• 与集中框架代码和应用程​​序需要使用的所有Angular /供应商内容单独捆绑Angular内容将从主捆绑中排除
  • 使用类似CDN的方式集中自定义框架内容并引用该包(在包中没有角度代码)
  • 所以你最终得到这样的东西:

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

在这种特定情况下,最好的方法是什么？我找不到这种架构设置的好例子.

Answer 1

只需使用这种结构： <script src="vendor-bundle.js"></script> <script src="/central-location/frameworking-bundle.js"></script> <script src="app-bundle.js">/script>;

并在 Frameworking-bundle.js 上使用 eTags/lastmodified 缓存，这样，如果修改了文件，则会再次下载。用户将始终获得最新版本，而无需使用版本/散列/查询字符串。它不必对代码进行修改。 https://betterexplained.com/articles/how-to-optimize-your-site-with-http-caching/

框架代码应排除供应商代码，应用程序应定义它。就像 Kendo 要求你有 JQuery 一样。