差异加载是一种策略,其中CLI会构建两个单独的捆绑软件作为已部署应用程序的一部分。
默认情况下,Angular CLI版本8和更高版本支持差异加载。对于工作区中的每个应用程序项目,您都可以根据应用程序项目中的browserslist和tsconfig.json文件配置生成构建的方式。
如果我们有两个具有差异加载功能的单独捆绑包,是否会引起构建大小问题和应用程序性能?
请分享您的建议,以便我可以在当前项目中选择此功能。
答案 0 :(得分:1)
简而言之,它将使更新的浏览器获得具有更新功能的捆绑软件,而较旧的浏览器将获得转译版本。因此,是的,它将增加服务器上应用程序的大小,但不会增加将要下载的捆绑软件(您将不会下载两个捆绑软件等)。差异加载是浏览器根据其自身功能在现代JavaScript或旧版JavaScript之间进行选择的过程。现在,默认情况下,我们通过对应用程序执行现代版本(es2015)和旧版本(es5)来利用此优势。用户加载您的应用程序时,他们会自动获得所需的捆绑软件。
例如,如果您查看生成的index.html:
<script src="runtime-es2015.33c6d44d6f111520cede.js" type="module"></script>
<script src="runtime-es5.33c6d44d6f111520cede.js" nomodule defer></script>
较新的浏览器将下载带有<script>
的{{1}}标签,它们将忽略具有type="module
属性的<script>
:
nomodule属性是一个布尔属性,可以防止脚本在支持模块脚本的用户代理中执行。