Предварительная загрузка для файла css, используемого непосредственно [дубликат]

В самой базовой форме он устанавливает link с высоким приоритетом rel="preload". В отличие от предварительной выборки, которую браузер может решить, является ли это хорошей идеей или нет, preload заставит браузер сделать это.

=== Более подробный взгляд: ===

Вот фрагмент из W3c

Многие приложения требуют мелкозернистого управления, когда ресурсы извлекаются, обрабатываются и применяются к документу. Например, загрузка и обработка некоторых ресурсов может быть отложена приложением для сокращения конкуренции ресурсов и повышения производительности начальной загрузки. Такое поведение обычно достигается путем перемещения ресурсов в пользовательскую логику загрузки ресурсов, определяемую приложением, то есть выборки ресурсов инициируются через введенные элементы или через XMLHttpRequest, когда выполняются особые условия приложения.

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

Объявление ресурса через один из существующих элементов (например, img, script, link) связывает извлечение и выполнение ресурсов. Принимая во внимание, что приложение может захотеть получить, но задерживает выполнение ресурса до тех пор, пока не будет выполнено какое-либо условие. Получение ресурсов с помощью XMLHttpRequest для предотвращения превышения поведения приводит к серьезному снижению производительности, скрывая декларации ресурсов от DOM агента пользователя и предзагрузочных парсеров. Извлечение ресурсов отправляется только при выполнении соответствующего JavaScript, что из-за обилия скриптов блокировки на большинстве страниц приводит к значительным задержкам и влияет на производительность приложения. Ключевое слово preload на элементах ссылок предоставляет примитив декларативного извлечения, который обращается к вышеупомянутому варианту использования, инициирующему раннюю выборку и отделяющую выборку от выполнения ресурса. Таким образом, ключевое слово preload используется как примитив низкого уровня, который позволяет приложениям создавать пользовательские загрузки ресурсов и выполнение поведения, не скрывая ресурсы от пользовательского агента и не вызывая отложенных штрафов за доступ к ресурсам.

Например, приложение может используйте ключевое слово preload для запуска раннего, высокоприоритетного и не-рендерингового извлечения ресурса CSS, который затем может быть применен приложением в соответствующее время:

<!-- preload stylesheet resource via declarative markup -->
<link rel="preload" href="/styles/other.css" as="style">
<!-- or, preload stylesheet resource via JavaScript -->
<script>
var res = document.createElement("link");
res.rel = "preload";
res.as = "style";
res.href = "styles/other.css";
document.head.appendChild(res);
</script>

действительно глубокий взгляд на W3c: https://w3c.github.io/preload/

Но я был бы осторожен, если вы планируете использовать его в качестве поддержки браузера. не так уж и много, поддержка глобального браузеров составляет всего 0,18%.

Вот полный список: http://caniuse.com/#search=preload