如何改进 PageSpeed Insights？

Question

我在 Angular 17 SSR 中有一个项目，激活了预渲染，并且有一个包含 url 的routes.txt 文件。该项目部署在 Vercel 中，页面性能较差。

我的组件具有独立的 true 激活状态，并且在我的 app.routes.ts 中具有延迟加载的组件，如下所示：

{
    path: 'google-search',
    loadComponent: () => import('./pages/google-search/google-search.component')
    .then((gs) => gs.GoogleSearchComponent)
},

我看到的另一个观察结果是，在 head 标签之间，chunks.js 列表在每个视图中都在收费，所以我不知道这是否正常，这就是我的网站获得此资格的原因，我还尝试添加库图像性能，但会出现一条警告，表示不建议在激活 ssr 的情况下这样做。我决定激活 ssr 的原因之一是因为我认为性能会更好，而且还有预渲染选项和更好的 SEO。

我尝试了很多方法来获得更好的表现资格，但没有任何帮助，所以如果有人有任何想法可以分享。

Answer 1

这些是我在没有看到你的项目的情况下可以给出的建议。 如果你的项目有很多图像，我认为你不应该使用预加载策略。看一下“可延迟视图”。 此外，图像优化也很重要。使用 ngSrc 而不是 img src.(NgOptimizedImage) 。 我也用了‘ssr’和‘Angular 17-18’，我的分数在80左右。但是我用的图像很少