Как оптимальней подключить большой css?

Question

[Сергей Бубнов]

Занимаюсь оптимизацией загрузки страницы, в данный момент взялся за css.
Первым делом объединил их в 1 файл, теперь думаю как сделать загрузку страницы без ожидания прогрузки стилей.
Кеширование настроено, грузится вроде терпимо по скорости, но хочется большего, тем более Google PageSpeed Insights настоятельно рекомендует "Удалите из верхней части страницы CSS, блокирующий отображение".

Интересует самый оптимальный вариант. Я знаю 3 и у каждого из них есть минусы:
1. Перенести загрузку в самый низ. Страдает отображение в первую секунду - голый текст. Может это можно обойти?
2. Сделать добавление стилей через js. Опять же может мелькнуть голый текст + в случае отключенного js ничего хорошего не предвидится.
3. Тоже что и в первом пункте, но выделить часть стилей, которые влияют на отображение общей структуры страницы. Проблема в том, как собрать нужные стили, которые непосредственно используются на странице? Firebug - долго.

Answer 1

[Антон Шаманов]

ETag - обеспечивает веб проверку кэша, и который позволяет клиенту делать условный запрос
Gzip сжатие для ускорения загрузки сайта — как его включить для Js, Html и Css с помощью файла .htaccess

Answer 2

[Андрей]

Третий вариант единственный правильный.
Если вы собираете файл из нескольких, попробуйте выделить неиспользуемые в отдельный файл.

Есть хороший инструмент для поиска неиспользуемых стилей: https://addons.mozilla.org/en-US/firefox/addon/dus...