Подтвердить что ты не робот

Является ли загрузчик стиля webpack для загрузки всех css? Или просто специфичный для приложения css?

Я пытаюсь сделать мой внешний процесс оформления более модульным и изучаю webpack. Он поддерживает загрузчик стилей, который позволяет импортировать файл css и вставлять его в документ следующим образом:

require("style/url!file!./file.css");
// => add a <link rel="stylesheet"> to file.css to document

Однако мой основной упор делается на веб-сайты, а не на webapps 1 поэтому странно добавлять CSS через javascript. Но я могу просто быть старомодным, поэтому мне интересно: стоит ли загрузчик использовать для всех css или он предназначен только для загрузки небольших условных частей css?

И если он может быть использован для загрузки всех css, будут ли какие-либо штрафы при использовании созданного webpack bundle.js для вставки css, а не для прямого связывания файла css в html? Кроме того, он явно ломается, если javascript не включен?


1: Разница в том, что у меня очень мало динамического контента, javascript играет лишь незначительную роль на этих веб-сайтах и ​​что я не маршрутизирую с помощью javascript, а статические файлы .html для страниц

4b9b3361

Ответ 1

По возможности включите CSS с самим HTML. Современные браузеры начнут собирать CSS, поскольку страница анализирует, иногда до того, как JavaScript даже начал загружаться. Вы получите улучшенную скорость рендеринга страницы, делая большие части за пределами загрузчика.

Кроме того, если вы придерживаетесь основного "основного" стиля, вы можете извлечь выгоду из кеширования, которое будет загружаться быстрее, чем JavaScript.

http://csswizardry.com/2013/01/front-end-performance-for-web-designers-and-front-end-developers/


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