Как отложить загрузку CSS?
Языки программированияСоздание сайтовCss
Анонимный вопрос
· 13,6 K
ОтвечаетАрсений Матыцин
Лучше всего не создавать ситуацию, когда необходимо откладывать загрузку каких-то стилей, т.е. прямо говоря, создавать билды под контент конкретных страниц\шаблонов.
В остальном можно воспользоваться динамической загрузкой компонентов, например ленивой загрузкой React-а. Или банальной конструкцией setTimeout, запущенной в конце документа (по факту загрузки, см. события DOM в JS) и генерацией стилей, а можно и скриптов, с помощью https://developer.mozilla.org/ru/docs/DOM/document.createElement.
Frontend-разработчик, основатель учебного портала frontendblok.com, frontendhelp.me и... · 7 сент 2018 · youtube.com/channel/UCn5wduCq2Mus0v85QZn9IaA
Для асинхронной загрузки CSS можно использовать jQuery, если вы уже применяется его на своем сайте.
Добавьте следующий скрипт:
> $("head").append("<link rel='stylesheet' type='text/css' href='/styles.css' />");
Если этот код необходимо выполнить после загрузки документа и jQuery соответственно, например в методе ready, то пишем следующее:
> $(document).ready(func... Читать далее
Куда добавить? В какой файл?
Если вы имеете ввиду загрузку критического CSS после загрузки страницы, то попробуйте эти варианты:
1) С использованием jQuery:
<html>
<head>
<style>
.blue{color:blue;}
</style>
</head>
<body>
<div class="blue">
Hello, world!
</div>
</body>
</html>
<noscript><link rel="stylesheet" href="small.css"></noscript>
2) С использованием NoScript и JS
<html>
<head>
<style>
.blue{... Читать далее
полная бридятина
к какому скрипту написали ? это что Hello, world! ?
Разработка корпоративных сайтов и интернет-магазинов с 2013 года. Большой опыт в сфере... · 26 авг 2020 · pavelorekhov.ru
ОтвечаетПавел Орехов
Если у вас в проекте есть большие файлы css:
- Для начала их можно менимизировать например с помощью сервиса https://csscompressor.com/ . Я выбираю обычно метод "High" css код получается компактный и удобно читаемый.
- Чтобы при загрузке сайт не скакал Стили первого экрана вынесите в HEAD.
- Все остальные стили по возможности уберите в подвал.
- Включите на сайте кеширо... Читать далееСколько слышал убрать стили в подвал, и пробовал, не красивая загрузка сайта получается, лучше пусть будут в head... Читать дальше