私のプロジェクトのHEADセクションで使用されている外部スクリプトにdefer属性を追加しています。私は複数のdefer'edスクリプトタグの実行順序に関するクエリを持っていました。ブラウザでスクリプトと実行順序を延期する
以下は、私たちはより良い私のクエリを理解するのに役立ちます私の観察です：
延期属性が存在しているhttp://www.w3.org/TR/html5/scripting-1.html
を解析し終えたときにスクリプトが実行されます1として、ページが
defer属性が機能します。しかし、私は実行命令に疑問があります。 FFとChromeで違うようです。私porject 1として
：
ここ<script defer="defer" src="{SERVER_PATH}/deps.js?1441452359"></script>
<script defer="defer" src="{SERVER_PATH}/script1.js?1440067073"></script>
<script defer="defer" src="{SERVER_PATH}/script2.js?1441451916"></script>
は、20〜50キロバイトのレギュラーサイズ（gzipされた）のscript1-3あり、一方、120キロバイト（gzip圧縮された）の周りの巨大なファイルであるdeps.js。
Firefoxでは、延期されたスクリプトの実行は外観順に開始されますが、同じ順序で完了することはありません。以前のスクリプトが実行を完了しない限り、次のスクリプトの実行は開始されません。 Chromeは理にかなっているようです。
実行順序をテストするために、各スクリプトの最初と最後の行にconsole.logを挿入しました。クロームのコンソール出力の下
Execution Start: deps
Execution Start: script1
Execution Start: script2
// Script Error as script1 needs deps to render completely.
// Script Error as script2 needs deps to render completely.
Execution End: deps
：deps.jsのFirefoxのコンソール出力の下
console.log("Execution Start: deps");
// minified deps script content.
console.log("Execution End: deps");
に上記のように
Execution Start: deps
Execution End: deps
Execution Start: script1
Execution End: script1
Execution Start: script2
Execution End: script2
しかし、FFの動作は、常にではありません。 Chromeのように機能することもあります。それはFirefoxのような問題のように見えます。または、deps.jsファイルが重くて小さくなり、レンダリングに時間がかかるためです。
似たような経験を持つ人は誰でも私を助けることができますか？他の情報が必要な場合はお知らせください。
PS：ページの一番下にスクリプトを移動するなどの他の解決策は、私が今見ているものではありません。
ファイルを遅延すると、ファイルに確実に実装されていれば、要素に表示されるようにファイルが実行されることが保証されます。問題の私の好きな説明：http://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html –
@NinoŠkopac私はあなたに同意します。彼らは順番に実行する必要があります。しかし、FFは時々differentyに振る舞い、実行開始順序は同じですが、実行終了順序は同じではありません。同じ実装がChromeで正常に動作します。奇妙な –
最新のFFを使用していますか？ –