Оптимизация кода CSS для загрузки страницы сайта без торможения.
При клике по ссылке, браузер запрашивает внешние файлы CSS, перед отображением содержимого ссылки на мониторе. Это приводит к задержке и замедляет обработку страницы. Это происходит, когда PageSpeed Insights обнаруживает, что кликнутая страница использует внешние таблицы стилей, препятствующие ее отображению на экране.
Если внешние ресурсы CSS имеют малый объем, их можно вставить непосредственно в документ HTML. Подобное встраивание позволяет браузеру продолжать загрузку страницы. Обратите внимание: если файл CSS слишком велик, после его встраивания PageSpeed Insights может вас предупредить, что верхняя часть страницы имеет слишком большой объем (правило приоритета видимого контента). Если файл CSS слишком велик, вам необходимо найти код CSS, отвечающий за контент в верхней части страницы и встроить его в HTML, отложив загрузку остальных стилей.
Не встраивайте URI больших объемов данных
Будьте осторожны при встраивании URI данных в файлы CSS. В то время как использование URI небольших объемов данных иногда имеет смысл, при встраивании URI, ссылающихся на объемные файлы, код CSS верхней части страницы может увеличиться, что замедлит загрузку страницы.
Не встраивайте атрибуты CSS
Не следует встраивать атрибуты CSS в элементы HTML (например, < p style=...>), так как это приводит к излишнему дублированию кода. Кроме того, подобное встраивание по умолчанию блокируется правилами по безопасности контента.