Angular2 实现 YSlow 的性能建议

Question

我经常使用YSlow和google的pagespeed对我的网站进行一些基本的性能检查。我是 Angular2 的新手，最近一直在做一个 Angular2 项目，我在 Angular2 应用程序上运行了 YSlow 和 PageSpeed 测试。

PageSpeed没有运行，YSlow给出了一些改进建议。根据这些建议，我应该在以下 js 文件上添加到期标头 -

inline.bundle.js  
styles.bundle.js  
main.bundle.js  
vendor.bundle.js

在 Angular2 中执行此操作的最佳/最有效的方法是什么？

此外，根据 YSlow 的另一个建议，我还应该压缩来自服务器的上述相同资源。当我使用 Angular-CLI 和 ng-serve 进行构建时，如何在我的本地机器中启用压缩？

Answer 1

您关心的是服务器设置，而不是角度本身。当你ng serve时，根本不做它们.它只会减慢你的发展速度。我在构建应用程序ng b -prod -aot的生产版本时进行测试，您可以在部署之前从dist/文件夹中提供服务以检查内容。

这是不影响 CLI 的简单方法

npm install --save-dev express compression connect-history-api-fallback

将此 express.js 添加到项目根目录：

var compression = require('compression');
var express = require('express');
var history = require('connect-history-api-fallback');

var app = express();
app.use(history());
app.use(compression());
app.use(express.static('dist'));
app.listen(4200, function () {
  console.log('n', 'Serving "dist/" on http://localhost:4200. [Ctrl+C] to disconnect.');
});

并在构建后运行它 node express.js 以验证生产版本是否正常工作并查看压缩的实际效果。