javascript — оценка Google PageSpeed - 1 файл блокировки рендера CSS
У меня есть веб-сайт WordPress.
Пытаясь набрать 100/100 баллов с помощью инструмента Google PageSpeed Insights, я застрял на 1 «ошибке».
Google говорит;
Устранить блокировку рендеринга JavaScript и CSS в верхнем содержании
На вашей странице есть 1 блокирующий CSS ресурс. Это приводит к задержке рендеринга вашей страницы.
Ни один из вышеперечисленных материалов на вашей странице не может быть обработан без ожидания загрузки следующих ресурсов. Попробуйте отложить или асинхронно загрузить блокирующие ресурсы или включить критические части этих ресурсов непосредственно в HTML.
Оптимизировать CSS-доставку следующего:
http://www.theoriereservering.nl/wp-content/themes/TESSERACT/style.css
Blockquote
Style.css является первым загруженным файлом и является внутренним, я использовал style.css, чтобы объединить все остальные CSS-файлы, и теперь style.css — единственный оставленный файл CSS, блокирующий рендеринг.
Могу ли я избавиться от этого последнего уведомления?
Решение
Попробуйте что-то подобное:
https://www.wpcub.com/eliminate-render-blocking-javascript-and-css-in-above-the-fold-content/
Должно помочь
Другие решения
Это удалит ошибку Google Pagespeed «Блокировать рендер CSS»:
Добавьте вышеупомянутые стили сгиба, встроенные на странице, в теги style, поместите остальные в ваш файл style.css и отложите его с помощью javascript, как …
<script stype="text/javascript">
function loadCSS(href){
var ss = window.document.createElement('link'),
ref = window.document.getElementsByTagName('head')[0];
ss.rel = 'stylesheet';
ss.href = href;
// temporarily, set media to something non-matching to ensure it'll
// fetch without blocking render
ss.media = 'only x';
ref.parentNode.insertBefore(ss, ref);
setTimeout( function(){
// set media back to `all` so that the stylesheet applies once it loads
ss.media = 'all';
},0);
}
loadCSS('style.css');
</script>
<noscript>
<!-- Let's not assume anything -->
<link rel="preload" href="style.css" as="style" onload="this.rel='stylesheet'">
</noscript>
и / или поместите его в нижний колонтитул страницы