前言
随着业务的代码一点点增加，加上Angular的项目本身就比 vue、react 的重一些，随之而来的启动速度，更改文件后编译速度，以及打包速度也会变慢，于是乎想着优化下我们的项目。
本文章主要说的是 ：
- 打包Angular项目的一些配置，性能优化方面的方案
- 打包后，用户进入页面的速度提升
禁止Rollup 摇树优化
所谓Rollup是指Webpack2会把那些应用中未使用的引用代码除掉，但不会删除这些代码，所以就需要配合 UglifyJs 能够智能的移除这些未使用的代码。从而减少包体大小。
而Agnular应用是基于Typescript，因此Angular Cli提供了一个叫 Angular Build Optimizer 插件，将 Typescript 编译结果转化成更友好的UglifyJs版本。这样UglifyJs就能够更有效的移除那些未使用的代码。
Angular Cli只需要加上 --build-optimizer 参数就可以，这将禁用供应商数据块，并导致代码更小。在一些情况下压缩的还是很厉害的。
在package.json 打包命令的地方
- –build-optimizer=true
"build-uat": "ng build --prod --configuration=uat --build-optimizer=true",
build-optimizer的 true 与 false 区别
这里说的是package.json 的打包命令
true
- –build-optimizer=true
默认情况下会启用Tree-Shaking。但是虽然减小了构建大小（只会减小几kb），打包的速度会增加
- 打包后大小 36.6M
文章来源：https://www.toymoban.com/news/detail-846745.html
false
- –build-optimizer=false
不使用摇树优化，牺牲打包空间换取时间
禁文章来源地址https://www.toymoban.com/news/detail-846745.html
到了这里，关于【Angular性能优化】项目8版本加载速度缓慢、白屏时间、首页渲染性能优化方案的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
