Angular 8 中的差分负载如何管理两个独立束的大小?



差分加载是一种策略,其中 CLI 构建两个单独的捆绑包作为已部署应用程序的一部分。

默认情况下,Angular CLI 版本 8 及更高版本支持差分负载。对于工作区中的每个应用程序项目,可以配置如何基于应用程序项目中的浏览器列表和 tsconfig.json 文件生成生成。

如果我们有两个具有差异加载功能的单独捆绑包,它会导致构建大小问题和应用程序性能吗?

请分享您的建议,以便我可以在当前项目中选择此功能。

差异加载是浏览器根据自己的功能在现代或传统JavaScript之间进行选择的过程。我们现在默认利用这一点,执行应用程序的新式构建 (es2015( 和旧式构建 (es5(。当用户加载您的应用程序时,他们将自动获得所需的捆绑包。

https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27

简而言之,它将使较新的浏览器获得具有较新功能的捆绑包,而较旧的浏览器将获得转译版本。所以是的,它会增加服务器上应用程序的大小,但不会增加将要下载的捆绑包(您不会同时下载两个捆绑包等(。

例如.html如果您查看生成的索引:

<script src="runtime-es2015.33c6d44d6f111520cede.js" type="module"></script>
<script src="runtime-es5.33c6d44d6f111520cede.js" nomodule defer></script>

带有type="module<script>标记将由较新的浏览器下载,并且它们将忽略具有nomodule属性的<script>

nomodule 属性是一个布尔属性,用于阻止脚本在支持模块脚本的用户代理中执行。

如果默认值是text/javascript,脚本元素的HTML "nomodule"属性的目的是什么?

相关内容

  • 没有找到相关文章

最新更新