複数のJavaScriptファイルを1コネクションでスッキリ一括読み込みする方法
2007年02月06日
Pre-compression also doesn't solve a multiple connection issue.
複数のJavaScriptファイルを1コネクションでスッキリ一括読み込みする方法。
HTMLでの読み込みタグも次のようにスッキリできます。
<!-- Namespace source file -->
<script src = "yahoo.js" ></script>
<!-- Dependency source files -->
<script src = "dom.js" ></script>
<script src = "event.js" ></script>
<script src = "dragdrop.js" ></script>
<!-- Slider source file -->
<script src = "slider.js" ></script>
↓
<script src = "scripts/yahoo.js, dom.js, event.js, dragdrop.js, slider.js"></script>
やり方はそんなに難しくなくて、まず、.htaccessなどでscriptsファイルをphpとして動作するように設定します。
<FilesMatch "^scripts$">
ForceType application/x-httpd-php
</FilesMatch>
で、リンク先の「Create “scripts”」にあるPHPスクリプトを作成して、scripts として保存しましょう。
これで、scripts/aaa.js とか、scripts/hogehoge.js にアクセスされると保存したPHPスクリプトが動作します。
PHPスクリプトはキャッシュディレクトリ ( cache/ ) を作る必要があります。これは複数のJavaScriptファイルを1個にしたときのキャッシュを保存するようです。
あと、読み込むJavaScriptファイルはscriptsと同じ階層に置くとよいようです。
要はPHPで複数のファイルを読み込んで、結合して1個にまとめ、1ファイルとして転送するわけですね。
出力のキャッシュもしてくれるので毎回ファイルを結合はしない上、E-TagやLast-Modifiedによるブラウザのキャッシュ管理やGZIP圧縮転送なんかの機能もスクリプトでやってくれるみたいです。(GZIPはデフォルトではオフ)
なかなかよいかもです。
投稿者 KJ : 2007年02月06日 07:06
|
![]()
間違いの指摘をしていただける方はメールでお願いします
最新のブログ記事
- Facebook風のサムネイル付きサジェストボックスを実装するサンプル
- 2009年7月3日 管理人のブックマーク
- PHPとCSSで動的に綺麗なパーセンテージグラフを描画サンプル
- 普通の写真をすばらしいアートにするためのPhotoshopチュートリアル集
- シマシマの見やすいテーブルを作成するMooToolsプラグイン「ZebraTable」
- 2009年7月2日 管理人のブックマーク
- 「フォローしてね」を表すTwitterアイコン集
- シンプルなTwitter検索を行うためのPHPスクリプト
- PHPのcURLを使ってできる便利なサンプル集
- 2009年7月1日 管理人のブックマーク
- iPhone3.0の緯度経度APIで移動履歴を地図描画するサンプル





















