ルール8 js,cssファイルは外部ファイル化する

  • 実はインラインのほうがHTTPリクエストは1回で済むからやっぱ高速なんだよね。
  • だけど、キャッシュできんだからやっぱ外部のほーがはやいじゃん。
  • サイトによって違うけど、原則としてはブラウザキャッシュがある状態でよくみられるサイトは外部でも問題ない。そうでないならインラインのほうがいい。
    1. ページビュー。どれくらいの頻度でくるか。
    2. ブラウザキャッシュあり状態か、なし状態か
    3. コンポーネント再利用性高いか。js,cssがひとつにまとまってるかないか。
  • しいて例外をあげるとすればトップページ。トップはまずキャッシュありで入ってくるってこと少ないから。
  • トップページはインラインの方がはやそう。でもコンポーネントダウンロードしてないのももったいない

ほんじゃ、いいトコ取りすればいいじゃん

  • on Load後にダウンロード
    • インラインで書いて、かつ下記を実行するよーなのを最後に書いておけばいいじゃん。
document.body.appendChild(jsファイル)
    • 注意としては2重宣言にならないよーに。iframeの中でやるってのがエレガント!!
  • 動的なインライン化
    • cookieに持たせてプログラムで判定させる。ちょっとマニアックすぎかなー。
キホンはjs,cssファイルは外部だけど、インラインのメリットも大事。トレードオフがあるってこともアタマに入れる。