cssファイル自身のlazyload (preload)

● A. rel="preload" で、読み込ませて読み込み後にスタイルに変更する

<link rel="stylesheet" href="style.css">

 ↓

<link rel="preload" href="style.css" as="style" onload="this.onload=null;this.rel='stylesheet'">

● B. media="print" onload="this.media='all'"をつけて読み込ませる

<link rel="stylesheet" href="style.css">

 ↓

<link rel="stylesheet" href="style.css" media="print" onload="this.onload=null; this.media='all'" />

● B. link rel="preload" を使用する

<link rel="stylesheet" href="style.css">

 ↓

<link rel="preload" href="style.css" as="style">

この先読みはあくまで後で使うためにリソースを先に読んでおくだけで、実行(適用)はされません

No.2274
02/09 15:50

edit