javascriptライブラリの使い方
aa.js bb.js cc.js の3つのjavascriptを使ったサイトを作成中です。
ヘッダーに
<script src="aa.js" type="text/javascript"></script>
<script src="bb.js" type="text/javascript"></script>
<script src="cc.js" type="text/javascript"></script>
と記載し、「aa.js bb.js cc.js 使う前提のスクリプト」をサイト上に記載しているのですが、aa.js bb.js cc.js のそれぞれが重いため、サイト記載のスクリプトがaa.js、bb.js、cc.jsより先に読み込まれてしまい、思ったような表示が出来ません。
(cc.jsが読み込まれないままの状態でサイトのスクリプトを読み終わってしまう)
そこで調べてみると、下記のようなライブラリを発見しました。
http://notnil-creative.com/blog/archives/1361
このライブラリ(script.js)を使うと、通常は以下のように書くJavascriptの読み込みが、
<script src="jquery.js"></script>
<script src="my-jquery-plugin.js"></script>
<script src="my-app-that-uses-plugin.js"></script>
下記のように書くことができるそうです。
$script('jquery.js', function () {
$script('my-jquery-plugin.js', function () {
$script('my-app-that-uses-plugin.js')
})
})
この書き方で、ページのレンダリングを阻害せず、非同期にJavascriptを読み込むことができ、なおかつ「jQueryが読み込まれてからjQueryプラグインを読み込み、そのあとウェブサイト用のスクリプトを読み込む」というような依存関係のある複数のJavascriptファイルの読み込みにも対応できちゃいます。
という優れものであり、私の要求にぴったりと思いました。
早速、http://notnil-creative.com/blog/archives/1361のページからscript.jsをダウンロードしたのですが、使い方がわかりません。
例ではヘッダーに
$script('jquery.js', function () {
$script('my-jquery-plugin.js', function () {
$script('my-app-that-uses-plugin.js')
})
})
と記載すればOKと書いてあります。
ただ、この記入方法で動くようにするためには、$scriptがscript.jsに連動していることを記載すべき
だと思いますが、javascriptでそのような例を見たことがなく困惑しています。
このスクリプトの使い方(ヘッダーの記入方法)について、ご教授頂けませんでしょうか?
宜しくお願い致します。