如何消除angular-cli站点中的渲染块js和css?

时间:2017-06-13 06:30:51

标签: angular-cli

运行ng build --prod后,我可以在新创建的dist文件夹中进入我的index.html文件,并将async属性添加到捆绑的脚本标记中,以防止它们被阻塞。这有助于网站速度,但偶尔会崩溃网站。 angular-CLI.json中是否有一个选项可以在构建过程中以更好的方式为我添加这个选项?我通过谷歌测试我的网站运行我的网站,我唯一要修复的是消除渲染阻止JavaScript和CSS的首要内容

下面的

是我从https://developers.google.com/speed/pagespeed/insights/

获得的更具体的结果

消除上层内容中的渲染阻止JavaScript和CSS

您的页面有4个阻止脚本资源和1个阻止CSS资源。这会导致呈现页面的延迟。在不等待加载以下资源的情况下,无法呈现页面上的上述内容。尝试推迟或异步加载阻止资源,或直接在Html中内联这些资源的关键部分。删除渲染阻止JavaScript: enter image description here

1 个答案:

答案 0 :(得分:0)

问题在于你正在渲染"以及#34;加载脚本后的页面内容。这意味着在不等待加载资源的情况下无法呈现页面。

要解决此问题,您应该在服务器端呈现页面内容,并内联所有css,以便在head部分中呈现折叠内容。

然后,您可以在现有内容容器上安装角度应用,并逐步增强网站。