使用していないCSSの遅延読み込み
使用していないCSSの遅延読み込みは、デザインCSSで使用していない、記述があればその記述を削除する。
CSSを非同期に読み込ませることで、ページ読み込みとの競合を避けることができます。
上記2つの方法について紹介していきたいと思います。
スコアは、62点ー>71点に上がりました。
使用してないCSSの遅延読み込みの解決方法
1つ目の方法は、使用してないCSSの削除です。
そのため、いらないCSSの記述などはすべて削除してください。デザインCSSから削除できます。
必ずバックアップを取り、間違えてデザインが崩れても元にもどすことができるようにしておいてください。
2つ目の方法では、CSSの遅延読み込みを行います。
参考にしたサイト。
qiita.com
CSSの遅延読み込みが実行される理由として、ペイロードでCSSの取得は行うがCSSの反映はせず
ページ読み込みが完了すると、スタイルシートへ反映する。そのため、ページ表示の際に競合は起こらずにCSSを反映することができる。
デザインCSSの上部に記述することで、CSSの非同期に反映することができます。
はてなブログのページ表示速度 考察はこちら
www.glco.xyz