消除 CSS 渲染阻塞，最好的方法
Elimiate CSS render-blocking, best way
我想消除我网站的渲染阻塞，但我做不到。
我不使用外部 css 文件或字体，只使用一个大的 css 文件。
当我将 css 文件中的所有内容复制到 AllcontentCSS 头部时，呈现块从 Google Page Insights 中消失
有没有一种方法可以消除渲染阻塞并在 head 中包含带有 link 的 css 文件，而不是在样式标签中复制所有 css 或将 css 插入正文标记？
您最有可能在寻找：
<link rel="stylesheet" href="yourFile.css" media="none" onload="if(media!='all')media='all'">
但是，在您继续之前，请阅读以下详细介绍该技术及其局限性的资源：
- initial article 作者：基思·克拉克
- follow up 作者：泰勒·亨特。
确保您也浏览了 Taylor Hunt 提供的链接。您可能想使用 Filament Group 的 loadCSS function/polyfill。
但请注意，此技术会在您的页面上导致 FOUC。您应该将 CSS 分为两部分：
- 布局基础知识（正常加载 - 渲染阻塞），
- 异步样式（加载异步）。
我想消除我网站的渲染阻塞，但我做不到。 我不使用外部 css 文件或字体，只使用一个大的 css 文件。 当我将 css 文件中的所有内容复制到 AllcontentCSS 头部时，呈现块从 Google Page Insights 中消失 有没有一种方法可以消除渲染阻塞并在 head 中包含带有 link 的 css 文件，而不是在样式标签中复制所有 css 或将 css 插入正文标记？
您最有可能在寻找：
<link rel="stylesheet" href="yourFile.css" media="none" onload="if(media!='all')media='all'">
但是，在您继续之前，请阅读以下详细介绍该技术及其局限性的资源：
- initial article 作者：基思·克拉克
- follow up 作者：泰勒·亨特。
确保您也浏览了 Taylor Hunt 提供的链接。您可能想使用 Filament Group 的 loadCSS function/polyfill。
但请注意，此技术会在您的页面上导致 FOUC。您应该将 CSS 分为两部分：
- 布局基础知识（正常加载 - 渲染阻塞），
- 异步样式（加载异步）。