2010-12-01 4 views
5

あなたのページが解析されていて、それが<script src='someExternalSite/jquery.js'></script>か何かにわたっている場合、ページはそのファイルがダウンロードされて利用可能になるまで待ってからパースを続けますか?外部のjavascriptの参照により、ブラウザがダウンロードされるまで待つのですか?

を追加しました:

は、ほとんどのブラウザは、同時に(彼らは順番にそれらを実行しても)、時間を節約するために、すべてのスクリプトをダウンロードしますか?

答えて

2

各タグは、jsファイルが完全にダウンロードされるまで、ページのさらなるレンダリングをブロックします。 bodyタグの末尾にjsファイルを置くことをお勧めします

0

すべてのメインブラウザはこれらのファイルを同期して取得して、リストの次のスクリプトが直前のものに依存するようにします。

0

はい、そのため、</body>タグの直前またはdefer属性の直前にスクリプトを追加することをおすすめします。

2

そのファイルが を解析するために継続する前にダウンロードして利用できる になるまで、ページ待機していますか?

JSがダウンロードされるまで待つだけでなく、解析されて実行されるまで待機します。ページの終わりにそれを置くことについての他のアドバイスは、スポットです。

いますほとんどのブラウザは、同時に は(彼らは順番にそれらを実行しても)時間 を節約するために、すべてのスクリプトをダウンロードしてください

実際には、新しいもののみと思う。私はブックマークしなかったこの年前のWebページを見て、申し訳ありません。

2

はいこれはブロックされ、スクリプトはそれ以前の他のスクリプトがロードされたときにのみ実行されます。

など。

<script src='someExternalSite/script1.js'></script> 
<script src='someExternalSite/script2.js'></script> 

ほとんどのブラウザは、これらの2つのスクリプトを並行して読み込むことで処理速度を上げようとします。 script2.jsがscript1.jsの前にロードされていても、両方がロードされるまで実行されません。

私は最近この問題に遭遇しました。だから私は関連する点のカップルを詳しく説明します。

document.write()は、この方法はまだ(script2.js前script1.js)を順次実行します停止するパーサを強制し、スクリプトを挿入:

document.write('<script src=\'someExternalSite/script1.js\'></script>'); 
    document.write('<script src=\'someExternalSite/script2.js\'></script>'); 

最後に、あなたが行うことによって、完全に非同期ロードを取得することができます:

var script1 = document.createElement('script'); 
script1.src = 'script1.js'; 
document.getElementByTagName('body')[0].appendChild(script1);  

var script2 = document.createElement('script'); 
script2.src = 'script2.js'; 
document.getElementByTagName('body')[0].appendChild(script2);  

スクリプトを並列に完全にロードされているので、最後の一つは、非常に高速ですが、大きな落とし穴があります。 Webkitベースのブラウザの場合、順序は保証されません。script1.jsが最初に読み込まれると、script2.jsはscript1.jsの前に実行されます。あなたがその問題を回避できれば、すべてのスクリプトを1つのjavascriptファイルにまとめると、この方法は素晴らしいことです。

Dynamic script addition should be ordered?

関連する問題