ページがブラウザに読み込まれるときに、正確に何が起こるかについての基本的な知識が不足していることがわかりました。
は、私がこのような構造を持っていると仮定します。ここでは
<head>
<script src="jquery.js" type="text/javascript"></script>
<script src="first.js" type="text/javascript"></script>
</head>
<body>
...
<script type="text/javascript" id="middle">
// some more JS here...
</script>
...
<script src="last.js" type="text/javascript"></script>
</body>
は、私が持っている質問は以下のとおりです。
で何が起こって物事は何のシーケンスですか?最初にDOMを実行してからJSを実行します。逆の場合、または同時に実行する場合(またはJSファイルのダウンロードが完了したらすぐに、DOMを意識することなく)終了しますか?私はスクリプトが順番に読み込まれることを知っています。
$(document).ready()
はどこに入りますか? FirebugのNetタブでは、DOMContentLoaded
イベントとload
イベントが表示されます。DOMContentLoaded
イベントが発生したときに$(document).ready()
がトリガーされますか?これについて具体的な情報を見つけることができませんでした(誰もが「DOMがロードされたとき」と言います)。「DOMがロードされている」とはどういう意味ですか?すべてのHTML/JSがブラウザによってダウンロードされ、解析されていることを確認しますか?それともHTMLだけ?
次のシナリオが可能です:
last.js
にコードを呼び出しますが、last.jsがロードされる前に実行されている$(document).ready()
がありますか?どこが最も可能性が高いでしょうか(first.js
またはインラインコードブロック)? このシナリオを防止するにはどうすればよいですか?
私は、いつ、どのような(すべての場合)かに依存し、何が起こるかの全体像をundestandしたいです。
非常に興味深い。将来を見据えてくれてありがとう! – montrealist
実際、スクリプトを最下部に置くと、ページが読み込まれる前にスクリプトを実行する必要があります。それらを非同期的にロードするほうがはるかに優れています。つまり、ブラウザを上に置いても、ブラウザはページの解析とスクリプトの並列読み込みを続けます。唯一の問題は、あなたがもうスクリプトの実行順序を知っていないことです。 – Jens
私はスクリプトで(開発ツールからエミュレート)IE9でaspxページをテストしたが
の終わりにの先頭から移動され、スクリプトが頭の中にいたときより速くするロード時間を見つけました。ユーザーエクスペリエンスを測定するための読み込み動画を記録しました。明白な勝者は私にはない – mishal153