Как правильно удалить код JavaScript и CSS, блокирующий отображение верхней части страницы?

Question

[Денис Шишкин]

Борюсь с этим советом:
Удалите код JavaScript и CSS, блокирующий отображение верхней части страницы
Сайт на wordpress. Преследует спортивный интерес. Пытаюсь делать по этому мануалу https://varvy.com/pagespeed/defer-loading-javascri...
Вставил этот код, перед </body>

<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>

Создал файл defer.js и положил его по такому пути /site.com.ua/wp-content/themes/xxx
После, в файл defer.js скопировал сам скрипт, например jQuery. Но вроде как ничего не происходит. Ошибка/рекомендация остается в гугл пейджспид...
Или есть более легкий способ от этого избавится?
Заранее спасибо всем кто ответит

Comments

[Денис Янчевский]

Если не секрет, зачем боритесь? Баллы от гугл пейджспид слабо связаны с реальной работой сайта.

[Kovalsky]

Преследует спортивный интерес

Answer 1

[Виктор]

Наплюйте на гугл пейджспид. Есть яваскриптовые блоки, которые обязаны быть в хедере страницы.

Answer 2

[Олег]

На голом js все элементарно делается.
Перед </body> вставляем

<script>
    var script = document.createElement('script');
    var link = document.createElement('link');
    /*Подключаем стили*/
    document.getElementsByTagName('head')[0].appendChild(link);
    link.setAttribute('rel','stylesheet');
    link.setAttribute('type','text/css');
    link.setAttribute('href','css/style.css');
    /*Подключаем скрипт*/
    document.getElementsByTagName('head')[0].appendChild(script);
    script.type = 'text/javascript';
    script.src= 'js/script.js';
    </script>