LABjsに並列のノンブロッキング動的ロード・スクリプト・ファイルの()学習、および実行順序を管理LABJS

LABjsは何ですか

LABjsは、ブラウザの範囲で最速のスピードが許すLABjsの特性を定義する機能、動的スクリプト・ローダされているパラレル・ロード、すべてのJavaScriptファイルのを、しかし、ファイル間の依存関係がある場合、あなたは選ぶことができ、適切な実行順序を保証するために、

合計はこれです:負荷の動的並列実行順序管理スクリプトファイルとスクリプトファイルがロードされます

使用

$ LABは、オブジェクトの代わりの<script>タグ、そして.script()メソッドは、JavaScriptファイルをロードします、.WAIT引数なし()メソッドは、ちょうどすぐにロードされたJavaScriptファイルを実行して表し、.WAITパラメータを持つ()メソッドはすぐに実行されますちょうどJavaScriptファイルをロードし、また、引数完成ランニングで指定された関数を実行します。

LABjsが連鎖する奨励ので、各メソッドは、オブジェクトへの$ LABの参照を返します、あなたは複数のスクリプトファイルをダウンロードする必要があり、あなたはチェーン$ LAB.script()メソッドを呼び出すだけです

あなたが、同時により多くの$ LABチェーンよりも実行できることに留意すべきであるが、それらは、順序関係が存在しないの完全に独立しています。あなたが別のファイルの後のJavaScriptファイルを実行することを確認したい場合は、操作の同じチェーンでそれらを書くことができます。いくつかのスクリプトが完全に無関係されている場合にのみ、あなただけの、異なる$のLABチェーンに相関関係が両者の間に存在していない番組を、それらを考慮すべきです。

注:待ち時間()並列ダウンロードには影響しません、すべてのファイルを並列にダウンロードされ、待機()を実行するかを決定

リライト

   <スクリプトSRC = " script1.js " > </ SCRIPT>
  <スクリプトSRC = " スクリプト2-a.js " > </ SCRIPT>
  <スクリプトSRC = " スクリプト2-b.js " > </ SCRIPT>
  <スクリプトタイプ= " テキスト/ javascriptの" >
    initScript1();
    initScript2();
  </ SCRIPT>
  <スクリプトSRC = " script3.js " > </ SCRIPT>
  <スクリプトタイプ= " テキスト/ javascriptの" >
    initScript3();
  </ SCRIPT>

script1.js、スクリプト2-a.js、スクリプト2-b.jsとscript3.js:上記のコードは、順次4つのJavaScriptファイルをロードします。最初の3つの文書をロードした後、2つの動作機能initScript1()とinitScript2();ファイルのロード後に第四、その後は機能initScript3()を実行します。

さて、LABjsで書き換えること:

  <スクリプトSRC = " LAB.js " > </ SCRIPT>
  <スクリプトタイプ= " テキスト/ javascriptの" >
    $ LAB
     .script(" script1.js " ).WAIT()
     .script(" スクリプト2-a.js " 
     .script(" スクリプト2-b.js " 
     .WAIT(関数(){
       initScript1();
       initScript2();
     })
     .script(" script3.js " 
     .WAIT(関数(){
       initScript3();
     });
  </ SCRIPT>

例1:

/ * *
* 3つのJSファイル、非同期ロードの間には依存関係はありません
* * /
<スクリプトSRC = "LAB.js"> </ SCRIPT>
$ LAB
.script(" script1.js " 
.script(" script2.js " 
.script(" script3.js " 
.WAIT(関数(){ // すべてのスクリプトの待ち時間が、このコードブロック実行してロードされた
    script1Funcを();
    script2Func();
    script3Func();
});

例2:

/ * *
*負荷のjsファイルの種類を指定します。
* * /
<スクリプトSRC = "LAB.js"> </ SCRIPT>
$ LAB    
.script({SRC:" script1.js "、種類:" テキスト/ javascriptの" })
.script(" script2.js " 
.script(" script3.js " 
.WAIT(関数(){ // すべてのスクリプトの待ち時間が、このコードブロック実行してロードされた
    script1Funcを();
    script2Func();
    script3Func();
});

例3:

<スクリプトSRC = "LAB.js"> </ SCRIPT>
$ LAB.script(" script1.js "" script2.js "" script3.js " 
.WAIT(関数(){ // すべてのスクリプトの待ち時間が、このコードブロック実行してロードされた
      script1Funcを();
      script2Func();
      script3Func();
});

例4:

<スクリプトSRC = "LAB.js"> </ SCRIPT>
$ LAB.script([ " script1.js "" script2.js " ]、" script3.js " 
.WAIT(関数(){ // すべてのスクリプトの待ち時間が、このコードブロック実行してロードされた
      script1Funcを();
      script2Func();
      script3Func();
});

例5:

<スクリプトSRC = "LAB.js"> </ SCRIPT>
$ LAB.script(" script1.js " 
.WAIT()     // 空の待ち時間()だけで、他のコードの前に実行されることを確認SCRIPT1を作る 
.script(" script2.js "// スクリプト2とSCRIPT1にscript3依存 
.script(" script3.js " 
.WAIT()     // しかし、スクリプト2とscript3がお互いに依存しない実行が完了した後、ダウンして行くために、並行してダウンロードすることができます 
(.script script4.js // script4 SCRIPT1、スクリプト2とscript3に依存して、1,2,3エンド・ランは4実行されます
.WAIT(関数(){
    script4Func();
});

例6:

<スクリプトSRC = "LAB.js"> </ SCRIPT>
LAB.script $(" script1.js "// SCRIPT1、スクリプト2、依存関係のない間とscript3関係、 
.script(" script2.js "//は、任意の順序で実行することができる 
.script(" script3.js " 
.WAIT(関数(){     // Ifはもちろんjavascript関数が実行されてもよい、希望 
      の警告(スクリプトが1-3ロードされています!);
})
.script(" script4.js "//はSCRIPT1、スクリプト2とScript3に依存
.WAIT(関数(){
    script4Func();
});

例7:

<スクリプトSRC = "LAB.js"> </ SCRIPT>
LAB.setOptions $({AlwaysPreserveOrder:真へ })// 各スクリプト間ウェイトが設けられ 
.script(" script1.js "// SCRIPT1、スクリプト2、Script3、script4相互依存 
.script(" script2.js "/ / と注文執行の並列ダウンロード 
.script(script3.js 
.script(" script4.js " 
.WAIT(関数(){
      script4Func();
});

例8:

 
 
<スクリプトSRC = "LAB.js"> </ SCRIPT>
LAB.script $(関数(){
         // _is_IE`すなわち`の値がfalseに非すなわち、真である
        IF (_is_IE){
             リターン" ie.js " ;     // このJSは、それがロードされます、つまり場合 
        } {
             リターン ヌル ;     // そうでない場合は、すなわちコードはスキップされます
        }
    })
.script(" script1.js " 
。待つ();    

ダウンロード

参照

ルアンYifeng:Javascriptのファイルがロードされます。LABjsとRequireJS

LABJSオン

おすすめ

転載: www.cnblogs.com/kunmomo/p/12153492.html