А нужно ли вообще генерировать критические CSS?

А нужно ли вообще генерировать критические CSS?

Много написано уже статей от сотрудников Google и от других авторов, как важны критические стили. Есть много возможностей их генерации и внедрения. Но давайте разберёмся, нужны ли они фактически сайтам? И можно ли как-то обойтись без их генерации и при этом сайт будет достаточно быстро загружаться?

Мой ответ: «Да, можно».

Суть очень проста, если на сайте небольшое количество стилей, то их достаточно просто выгрузить все в HTML страницу и отключить CSS файлы.

- И на этом всё?

- Да.

Этот путь является, как ни странно, оптимальным при работе небольших сайтов. Даже 1 МБ стилей отлично сжимается в 256 Кбайт т.к. это обычный текст, а архиваторы сжимают его очень легко. В конечно итоге нам без разницы или в HTML странице сожмётся этот файл стиля, или при загрузки отдельного файла. При этом мы исключаем запросы к CSS файлам вообще, и загрузка сайта фактически происходит моментально.

Подходит ли данный метод любым сайтам?

Нет, данный методе не подходит, если у вас слишком большие файлы CSS, от 2 МБ и более. В таком случаи сайт не будет отображаться пока не загрузится полностью HTML с его встроенными стилями. Также если включено кэширование, то HTML страницы начнут занимать излишне много места на диске.

Можно делать комбинированный метод, когда у вас есть страницы для не авторизированных пользователей и полноценный личный кабинет. В таком случаи можно выгружать полноценные CSS для не авторизированных пользователей и только те, которые касаются сайта. А вот в личном кабинете, элементы управления лучше сделать в виде критически CSS с последующей загрузкой остальных.

В любом случаи, все методы надо тестировать и изучать какой лучше подходит именно для Вашего проекта!

 
Оформление заказа
Не отправляйте пароли от Вашего сайта. Дополнительные данные будут запрошены отдельно по необходимости.
Мы получили Вашу заявку!
Скоро с Вами свяжутся и мы обсудим все детали.


Обязательно проверяйте папку "Спам". Мы постараемся отвечать быстро!