Как лучше загружать стили vue?

Всем привет!

Решил изучить ленивую загрузку, и не знаю как правильно загружать css стили.
Есть два варианта:
  1. Загружать стили отдельно (параллельно с n.bundle.js)
  2. Загружать стили в n.bundle.js


Разницы в скорости загрузки нету.
Тестировал в disable cache и slow 3g
5b28fc4d431a5589901833.png

В одном из компонентов (0.bundle.js) в тег style я вставил css-библиотеку весом 270 кб, для наглядности.
В первом случае, раньше загружается 0.bundle.js, только потом, догружается 0.style.css. Но при этом, надпись, "welcome to page 3" появляется только после загрузки 0.style.css (почему?), хотя js уже скомпилировался.

Во втором случае мы имеем 0.bundle.js вместе с css внутри.

Так вот, как же лучше загружать css и как делаете это вы?
  • Вопрос задан
  • 610 просмотров
Пригласить эксперта
Ответы на вопрос 1
profesor08
@profesor08
Самые нужные стили в head. Как вариант для первоначального показа страницы, или загрузочного экрана.
Остальные стили перед закрывающем тегом body либо подгружать асинхронно, вставляя их в документ. Аналогично можно сделать и со скриптами. В конец страницы асинхронный загрузчик. Это такой идеальный вариант.

Но на деле скрипты и стили кешируются в браузере и вообще пофиг где они расположены, и как загружаются, они уже все загружены браузером и применяться почти мгновенно.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы