前の記事 ≪:IEで透過PNG画像の透過処理を簡単に行うJavaScriptライブラリ「alphafilter.js...
次の記事 ≫:JavaScriptで3Dオブジェクトを作成するためのライブラリ「JS3D」

複数のJavaScriptファイルを1コネクションでスッキリ一括読み込みする方法

2007年02月06日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法
Supercharged Javascript
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はデフォルトではオフ)

なかなかよいかもです。

関連の記事検索:JavaScript, PHP, チュートリアル, Web制作
スポンサード リンク

By.KJ : 2007年02月06日 07:06 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)