ページにはどこにjavascriptを含める必要がありますか？

Question

私はRailsアプリケーションを構築しており、javascript_include_tagsをページの上に表示するのが一般的なようです。

ブラウザでドキュメントをロードする前にjavascriptをロードすると、表示される要素の読み込み時間が長くなりますか？

ありがとうございます。

Answer 1

は見えるが、どれもそれをすべて合計しません：

• 他の要素をロードするからJavaScriptの読み込みを防ぐためにどのように？シンプルで、終了の直前に入れてください。</body>タグ通常は、HTMLページの最後の文字を意味します。
• すべてのjavascriptを外部の.jsファイルに入れます。どうして？ HTMLページが変更された場合でも、ブラウザはこれらのファイルをキャッシュすることができます。
• すべてのjavascriptファイルを集約して1つに縮小します。どうして？クライアントが行うHTTP要求が少ないほど、ページが高速にロードされます。

また、すべてのあなたのHTML要素はJavaScriptファイル（あなたが右の終了</body>タグの前に、JSファイルを置く場合には、ある）の前にロードされますので、約$(document).ready()またはwindow.onloadを気にする必要はありません。

Answer 2

私がウェブで読んだ限り、ベストプラクティスはbodyタグの下部にjavascriptファイルを読み込みます。これにより、javascriptを実行する前にほぼすべての読み込みが可能になります。これにより、スクリプトを上に読み込んだ場合に存在しない可能性のある項目にアクセスする際の問題を防ぐことができます。

Answer 3

Webページのパフォーマンスに関するYahooの投稿は、他の依存関係の並行ダウンロードをブロックすることができるため、ページ下部にそれらを含めて表示しています（Source）。

Answer 4

外部JSファイルを使用してコンテンツを縮小することをお勧めします。

• http://www.quirksmode.org/js/placejs.html

ジョン・フィッシャーが言ったようにページの下部にもオプションです。

つまり、jQueryを使用している場合、JS関数を使用する前に、ページDOMがロードされていることを確認する$()または$(document).ready(function()を使用してください。

Answer 5

ではなく、そのマークアップで動作を埋め込む、次のように、 文書本体の範囲外、ページのセクションにスクリプトブロックに移動して、スクリプト を分離しようとする：

<script type="text/javascript"> 
window.onload = function() { 
document.getElementById('testButton').onclick = function() { 
document.getElementById('xyz').style.color = 'red'; 
}; 
}; 
</script> 

パフォーマンスの理由から、スクリプトブロックはドキュメント本体の末尾にある に配置することもできますが、現代のブラウザでは、パフォーマンスは ではなくむしろ間違いになります。重要な概念は、構造的要素内に振る舞いの 要素を埋め込むことを避けることです。いくつかの答えが正しかったよう