Core Web Vitalに関する連載の第5回はCSSとJSの遅延読み込みについて説明する。この2点は主に「レンダリングを妨げるリソースの除外」という項目でPage Speed Insightsに表示される。 WordPressプラグインのおすすめまでしてくれる。 プラグインで対応する方法もあるのでプラグインを導入して済めばそれでよし。本稿では原理の説明とコードによる解決を紹介する。テーマ本体に手を入れなくてもよいソリューションなので、ぜひ取り組んでほしい。筆者の開発したテーマSide Businessでもほぼ似たようなことをやっている。 CSSの遅延読み込み CSSは通常headタグ内に挿入される。ブラウザは <link> タグを見つけるたびにCSSをダウンロードし、その内容を解析してスタイルコンテキストツリーを構築する。この間はHTMLのパース(DOMモデル構築)やJavaScrip
![【WV.5】WordPressにおけるJSとCSSの遅延読み込み – Capital P – WordPressメディア](https://cdn-ak-scissors.b.st-hatena.com/image/square/0639b7abceb2e986890c6bbf832bb0c7a87924e6/height=288;version=1;width=512/https%3A%2F%2Fcapitalp.jp%2Fwp-content%2Fuploads%2F2021%2F07%2Fpexels-philippe-donn-1114688.jpg)