WordPress（Page Speed対応） - 小さな JavaScript をインライン化する

難易度

★すごく簡単

概要

対応方法は大きく3つあります。

htmlに直接インラインで記述する小さなJavascriptは他のJavascriptと合わせる WordPress プラグイン – Head Cleanerの「CSS と JavaScript を、サーバ上にキャッシュする → 複数の JavaScript を結合する」を使ってJavaScriptをがっちゃんこする

[html]<script src="/js/asobicocoro.js"></script> </body>[/html] [js]/ asobicocoro.jsの記述内容 / var url = window.location.href; alert(url);[/js]

↓

[html]<script> var url = window.location.href; alert(url); </script> </body>[/html]

記述の少ないJavaScriptを外部JSファイルで読み込みこんでいる場合は、htmlに直接インラインで記述しましょう。ということです。外部ファイルで読み込むメリットは、ブラウザがJSファイルをキャッシュしてくれるところにありますが、外部ファイルを読み込む際には、「TCP接続設定」「HTTP要求」「DNS名前解決」の3つのレスポンスが発生します。小さなJSファイルはキャッシュさせるより、html内に展開したほうがレスポンスを抑えられて高速化に役立つという理由です。