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

Question

[kit4kat]

PageSpeed достал вконец, пишет "Удалите код JavaScript и CSS, блокирующий отображение верхней части страницы", хотя все скрипты внизу, перед закрывающимся body. В чем может быть проблема?

Comments

[Dark Hole]

В head попробуйте

[Kovalsky]

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

хотя все скрипты внизу, перед закрывающимся body.

Прочитайте еще раз эти два предложения)

Вы планируете добиться 100% в pagespeed?

[kit4kat]

прочитал, а что там не так?) 80% хотя бы нужно, сейчас 73

[kit4kat]

ставил что в head что перед закрывающим body - результат одинаковый

[Kovalsky]

kit4kat: ну, вам пишут "Удалите код JavaScript и CSS", а вы пишите что "все скрипты внизу". Кроме скриптов там еще есть CSS, их тоже стоит сдвинуть или загружать асинхронно. PageSpeed Insights это эталон, придирается ко всему.

Кроме того, там же вроде на всё есть детальная инструкция, как решать те или иные проблемы производительности.

[kit4kat]

Инструкции смотрел, на других сайтах все отлично решалось переносом скриптов вниз. А здесь почему-то не срабатывает, скрипт я перенес вниз, а PageSpeed все равно пишет что этот скрипт мешает загрузке страницы. каким образом не понятно, если он в конце и грузится последним.

[Kovalsky]

kit4kat: а если попробовать вообще асинхронно его грузить?

[kit4kat]

Никита Полевой: асинхронно все ок, но тогда в firefox скрипты не работают. Поставил пока атрибут "defer" на скрипты, с ним все работает нормально, может позже удастся разобраться как сделать без этого костыля. Спасибо за помощь!

Answer 1

[xmoonlight]

1. Уберите все JS-скрипты из секции head.
2. CSS - грузите только ин-лайном (не из файла!)

Comments

[kit4kat]

в head скриптов нет, все перенес вниз, перед закрывающим body

[xmoonlight]

kit4kat: CSS ?

[kit4kat]

css есть, но если удалить то все равно на js файлы ругается. какой-то глюк что-ли, PageSpeed не реагирует на перенос скриптов вниз получается.

[xmoonlight]

kit4kat: дайте линк - я настраивал по максимуму свой. думаю, смогу понять.

[kit4kat]

adapt.kl.com.ua/webcam - вот сайт на тестовом

[kit4kat]

https://developers.google.com/speed/pagespeed/insights

[xmoonlight]

kit4kat: <link rel="stylesheet" href="css/style.css"> - перечитайте мой ответ!

[xmoonlight]

Никита Полевой: precosts.com - смотрите.

[kit4kat]

да, дело в стилях видимо, сейчас копну в эту сторону.

[kit4kat]

precosts.com - а что здесь?

[xmoonlight]

kit4kat: проверьте на Google Insights

[kit4kat]

понял, попробую сейчас стили инлайном поставить

[kit4kat]

xmoonlight: да, теперь все отлично, 99%) спасибо за помощь!

[kit4kat]

портянка стилей в html только смущает)

[xmoonlight]

kit4kat: Вы пытаетесь разделить логикой, а гугл - производительностью.
И он делает правильно: один поток всегда быстрее нескольких, а если есть разметка - то нужно избавиться от другого потока, по которому ждать подгрузки стилей. Поэтому, лучший вариант вообще всё в одном файле и в один поток.