Ответ 1
Не так много, если что-то изменилось за прошедший год или два, и с тех пор мы все еще имеем дело с множеством тех же браузеров, поэтому вы не должны менять свою практику.
<link>
является предпочтительным во всех случаях по сравнению с @import
, поскольку последний блокирует параллельные загрузки, а это означает, что браузер будет ждать, пока импортируемый файл завершит загрузку, прежде чем он начнет загружать оставшуюся часть содержимого.
Вы можете увидеть это здесь очень подробно:
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
Итак, хотя @import
может быть удобно, что все, что он предлагает. Если вы действительно хотите воспользоваться быстрым временем загрузки, используйте минимальное количество таблиц стилей (возможно, в большинстве случаев), напишите хороший CSS с эффективными селекторами (обычным материалом), уменьшите его и используйте тег <link>
.
Это будет комментарий, но он слишком длинный:
Вместо @import
(я знаю, что это очень удобно), вы должны объединять файлы в один, когда ваш сайт выходит в эфир. В любом случае вы не должны настраиваться в этом месте, и есть ряд инструментов, помогающих его минимизировать. Лично, используя PHP, у меня есть файл конфигурации, где я определяю все файлы CSS, которые записываются в отдельный файл CSS (тот, который я укажу в теге <link>
), а затем, если кешированная версия устарела (определяется вручную или автоматически), он объединяет/минимизирует их и записывает содержимое в файл "cache" и возвращает строку запроса времени, чтобы добавить к имени файла CSS, чтобы принудительно загрузить новую версию.
Если вы также используете PHP, я настоятельно рекомендую cssmin, он может анализировать таблицы стилей для @import
и вытягивать содержимое в один файл, а также обрабатывать все аспекты минимизации.