是否需要对Angular CLI Hello World应用优化,或者这是一个有效的"性能"结果吗
将Lighthouse应用于我们的live angular 4项目时,我们将与Angular CLI Hello World进行比较。
来自控制台:
npm install -g @angular/cli
ng new my-dream-app
cd my-dream-app
ng serve --prod
在Chrome中 - > F12 - >审核 - >跑灯塔。
更新1
转到@Moshe,使用:
ng serve --prod --build-optimizer
给出以下内容: - 性能为96/100。 - 第一个有意义的油漆是2,040毫秒 - 感知速度指数:2,054(目标:<1,250);等级92/100
最终难以形成一个单一,简明的问题。我理解ng serve
不适合生产使用,即使使用ags ..但这允许我在发布之前在我的localhost上进行测试。
答案 0 :(得分:6)
试试这个:
ng serve --prod --build-optimizer
build-optimizer标志是一种在CLI之上构建的新的树形抖动方法。
答案 1 :(得分:3)
ng serve
并非完全优化,它旨在快速显示您的项目以进行测试。如果您需要优化版本,则必须运行ng build --prod
来生成文件,然后您必须托管这些文件。对此进行测试,它会更快地运行。
答案 2 :(得分:0)
使用ng new <your app's name> --service-worker
创建PWA后,最佳灯塔审核结果来自以下内容:
使用优化构建应用
ng build --prod --build-optimizer
使用https将其托管在某处以利用HTTP2。 For example for firebase(您需要一个帐户):
npm install -g firebase-tools
firebase login
然后在你的根目录(通常是src和dist之上的那个)
firebase init
在那里,选择
托管:配置和部署Firebase托管网站
将其添加到firebase项目中,当您被问及公共目录时
您想将什么用作公共目录?
输入dist
。
之后
firebase deploy
审核ng serve
输出后的结果
(或npm start
),不具代表性,因为它侧重于编译
速度和调试的简便性。