Имеет ли значение сортировка файлов CSS и если, то почему?

Использование большего количества файлов означает больше запросов. Потребуется больше времени для загрузки и отправки ненужных запросов к серверу. Я бы остался с одним файлом.

Единственная веская причина иметь другие файлы css - это если у вас есть сторонние компоненты, чтобы они были разделены и иметь возможность легко обновлять их.

Порядок имеет значение: правила, загруженные позже, переопределят правила с тем же именем, загруженные ранее (это действительно даже для правил в том же файле).

Для оптимальной производительности лучше иметь только один файл css.

Но для удобства чтения было бы лучше иметь разные файлы для разных частей.

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

Что вы имеете в виду, что ваш сайт использует один файл CSS? Обычно вы пишете свои определения стилей в нескольких файлах, и они объединяются (или нет) в один файл. Я хочу сказать, что то, над чем вы работаете в своей среде разработки, должно оставаться модульным, читаемым и не должно зависеть от того, что у вас есть в производстве.

Что касается порядка файлов CSS, да, это имеет значение, поскольку вы можете перезаписать свои предыдущие определения.

Для оптимального кэширования я бы рекомендовал вам собрать весь CSS от производителя в одном файле, а ваш CSS - в другом файле с версией, чтобы при изменении чего-либо в коде браузер обновлял только этот файл.

Но все это зависит от инфраструктуры. Поскольку браузеры теперь могут отправлять несколько запросов одновременно, наличие нескольких файлов может привести к более быстрой загрузке страницы, чем только один. Но я не уверен в этом.

Вы можете взглянуть на gulp, чтобы автоматически оптимизировать и минимизировать свой код CSS. .

Все css в одном файле в порядке. Но это бесплатно: вы можете создать столько файлов css, сколько захотите. Однако обычно бывает так:

• 1 глобальный файл css для всей страницы. Вы помещаете сюда общий CSS, который полезен для каждой страницы вашего сайта. Вы можете называть его app.css, style.css или mywebsite.css или любое другое имя.

• 1 конкретный файл css для конкретной страницы, если вы хотите специально отделить этот css от глобального файла css. Потому что он будет содержать CSS, полезный только для нескольких страниц. Например, у вас есть специальный компонент, сделанный вами самостоятельно, или особый функционал. Пример: вы создали специальный код javascript, работающий с некоторым html для загрузки какого-либо файла, и вы хотите, чтобы ваш код js / css был отдельным.

• Обычно у вас также может быть одна страница css для каждой страницы, но всегда один глобальный файл css для всего сайта.

Примечание. Тот же вопрос действителен и для javascript.

Примечание 2: вы также можете подумать об использовании фреймворка для минимизации вашего javascript и css в один файл css / js в конце. На работе наш технический босс использует wro4j, который работает для java, но он должен существовать и во многих других фреймворках, так как вы можете искать в Google.