А нужно ли вообще генерировать критические CSS?
Много написано уже статей от сотрудников Google и от других авторов, как важны критические стили. Есть много возможностей их генерации и внедрения. Но давайте разберёмся, нужны ли они фактически сайтам? И можно ли как-то обойтись без их генерации и при этом сайт будет достаточно быстро загружаться?
Мой ответ: «Да, можно».
Суть очень проста, если на сайте небольшое количество стилей, то их достаточно просто выгрузить все в HTML страницу и отключить CSS файлы.
- И на этом всё?
- Да.
Этот путь является, как ни странно, оптимальным при работе небольших сайтов. Даже 1 МБ стилей отлично сжимается в 256 Кбайт т.к. это обычный текст, а архиваторы сжимают его очень легко. В конечно итоге нам без разницы или в HTML странице сожмётся этот файл стиля, или при загрузки отдельного файла. При этом мы исключаем запросы к CSS файлам вообще, и загрузка сайта фактически происходит моментально.
Подходит ли данный метод любым сайтам?
Нет, данный методе не подходит, если у вас слишком большие файлы CSS, от 2 МБ и более. В таком случаи сайт не будет отображаться пока не загрузится полностью HTML с его встроенными стилями. Также если включено кэширование, то HTML страницы начнут занимать излишне много места на диске.
Можно делать комбинированный метод, когда у вас есть страницы для не авторизированных пользователей и полноценный личный кабинет. В таком случаи можно выгружать полноценные CSS для не авторизированных пользователей и только те, которые касаются сайта. А вот в личном кабинете, элементы управления лучше сделать в виде критически CSS с последующей загрузкой остальных.
В любом случаи, все методы надо тестировать и изучать какой лучше подходит именно для Вашего проекта!
