javascript - JS の読み込みを延期 - ヘッドまたはボディに挿入

Question

最適化、キャッシング、ページ読み込み速度の点で最も推奨される方法を知りたいと思いました。Defer ローディングを使用する場合、Web サイト ドキュメントの BODY または HEAD に JS ファイルを動的に挿入する必要がありますか?

Answer 1

DEFERを使用している場合、スクリプトが実行されるとき、またはキャッシュされるときまで、スクリプトタグをHEADまたはBODYのどちらに配置するかは重要ではありません。いずれにせよ、ページの解析が終了した後に実行され、javascriptファイルで送信されたサーバーヘッダーに従ってキャッシュされます。

古いブラウザがDEFER属性を無視する場合に最適化するために、本文の最後にスクリプトタグを配置することもできます。

または、スクリプトタグをHEADに配置して、JavaScriptファイルをフェッチ順序の早い段階で取得することもできます（たとえば、本文で指定された画像、オーディオ、またはビデオファイルの前）。