Trevor Davis darüber, wie wir CSS verknüpfen werden, wenn wir voll auf HTTP/2 umsteigen
Dies ist das Gegenteil dessen, was wir seit Jahren als Best Practice tun. Aber um die Vorteile von Multiplexing zu nutzen, ist es am besten, Ihr CSS in kleinere Dateien aufzuteilen, so dass nur das Notwendige auf jeder Seite geladen wird. Ein Beispiel für Seitenmarkup würde in etwa so aussehen
<link href="stylesheets/modules/text-block/index.css" rel="stylesheet">
<div class="text-block">
...
</div>
<link href="stylesheets/modules/two-column-block/index.css" rel="stylesheet">
<div class="two-column-block">
...
</div>Diese Idee teilt einige Gene mit Critical CSS. Das Laden von CSS mit <link> blockiert, also laden Sie so wenig wie möglich davon sofort und den Rest, wenn Sie ihn benötigen. Es gibt keine Strafe für das Laden der Stylesheets einzeln aufgrund des HTTP/2-Multiplexing, und das Laden direkt vor dem HTML, das sie verwendet, nutzt die Blockierung sogar aus, indem es das Rendern des HTML nicht zulässt, bevor das CSS dafür geholt wurde. Außerdem können Sie bei Bedarf den Cache für diese kleineren CSS-Bits brechen, aber bedenken Sie, dass es möglicherweise nicht so gut komprimiert.
Die Sache ist die... für jeden Browser, der HTTP/2 nicht unterstützt (z.B. IE 10, Opera mobile/mini, UC browser), wird diese Technik, obwohl sie immer noch funktioniert, ziemlich schlecht für die Performance sein. Dies wird eine einfachere Entscheidung für Projekte sein, die diese Browser aus irgendeinem Grund nicht unterstützen müssen.