PageSpeed Insights 建议我：
“消除首屏内容中的外部渲染阻止 Javascript 和 CSS。您的页面有 1 个阻止 CSS 资源。这会导致页面渲染延迟。优化以下资源的 CSS 交付： http://itransformer.es/css/c0f9425.css"
css文件c0f9425.css是jquery-ui.css文件和自定义文件的组合文件。
我真的不明白这一点。我应该如何遵循这个建议？
【问题讨论】：
Google 建议您将最初需要的（首屏）CSS 内联，并在页面加载就绪时加载其余的 CSS。 See here.
javascript 也是如此。包括“必须有代码”内联并在页面加载时加载“很高兴有代码”为suggested here
想法是尽可能快地加载用户首先看到的内容。
我个人觉得很难遵循，因为它会拆分代码并使其更难维护。不过对于大型项目来说很有意义……
【讨论】：
我仅使用 javascript 文件成功解决了这个问题。
尝试在 script 标签或 defer 属性中添加 async 属性。
例如：
<script src="filename.js" async></script>
<script src="filename.js" async="async"></script>
或
<script src="filename.js" defer></script>
<script src="filename.js" async="async"></script>
我建议你使用异步，它只在需要时加载文件。延迟属性在页面末尾加载文件，有时它不会执行所需的功能。
【讨论】：
消除首屏内容中的渲染阻塞CSS问题。我解决阻塞CSS资源优化CSS交付的方式如下：
<script>
var cb = function() {
var l = document.createElement('link'); l.rel = 'stylesheet';
l.href = 'css/style.css';
var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
};
var raf = requestAnimationFrame || mozRequestAnimationFrame ||
webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);
</script>
【讨论】：
你可以将你所有的 css 代码文件转换成一个文件，然后 google 建议你只使用一个文件 renderblocking。否则，如果您正在使用 Wordpress 项目，您可以为您的网站使用各种插件，例如消除渲染阻塞 css 和 js。
如果你想完全渲染移除渲染阻塞，那么你可以把你所有的 css 代码放到 head 部分，效果很好。
【讨论】：
消除外部渲染阻塞
<script src="your-path.js" defer></script>
<script src="your-path.css" media></script>
【讨论】：