Загрузка нескольких CSS вместо одного большого

#html #css #веб_программирование #вёрстка #http

В эпоху всяких gulpов, gruntов, webpackов возникает вопрос:
А нужно ли склеивать все файлы стилей?

Насколько мне известно, обработка неиспользуемых CSS-правил занимает какое-то время.

Итак, есть у меня Bootstrap. И есть у меня простая страница контактов. На странице
контактов только сетка, пару кнопок и форма, когда бутстрап включает в себя ещё там
разные стили для модальных окон, всяких каруселей и другой байды.

Так вот, мне кажется, ведь в 20 раз будет эффективнее вместо одного bootstrap.css,
загрузить всего 3 - grid.css, buttons.css и forms.css? В отдельных файлах, а не в одном,
чтобы на других страницах grid.css или buttons.css подгрузились из кеша.

Хотя, пока писал это и сам убедился, что будет гораздо эффективнее. Но почему это
мало кто использует? Неужели потому, что проще всё сгрузить в один файл, чем в несколько?
    

Ответы

Ответ 1

Это не имеет особого смысла потому-что:


Стили бустрапа весят копейки и никто просто-напросто этим не замарачивается.
Вы не заметите никакой разницы в производительности.
Можно загрузить всего 3 стиля необходимых в вашем проэкте, это называется кастомизация,
в bootstrap 3 есть целый раздел где вы выбираете что необходимо вам в вашем проэкте
http://getbootstrap.com/customize/ .
В bootstrap 4 такая возможность есть через редактирования файла boostrap.scss.
Там c помощью @import подключены отдельные файлы которые отвечают за те или иные
вещи, просто напросто их там отключаете и собираете свой новый css скажем через gulp.