非同期とドキュメントの準備

Question

スクリプトにasync属性を入れてページを最適化しようとしています。 $(document).readyがすべてのスクリプトがロードされる前に実行されているので、私のjavascriptを壊すようです！

$(document).readyの代わりに$(window).loadを入れて問題を解決できることがわかりましたが、より良い解決策があるかどうか疑問に思っていました。私の場合は このソリューショントリガー2の問題は：

1. 私はすべての$(document).readyを変更し、
2. すべてのイメージがロードされた後にスクリプトが実行されるもうそれを使用しないように、すべてのdeveloppersを伝える必要があります。私のウェブサイトにはたくさんの重いイメージがあり、DOMの準備ができてからすぐに実行できるスクリプトが本当に必要です。

いくつかのマジックトリックはありますか？たぶんすべてのスクリプトを最後に置いていますか？ asyncの代わりにdeferを使用しますか？

Answer 1

膨大な研究の結果、私は間違いなくスクリプトをページの最後に置くことがベストプラクティスといえます。 http://developer.yahoo.com/performance/rules.html#js_bottom

Googleがこのような行為について話していないと非同期スクリプト好むようだ：

Yahooは私と一緒に同意する/ページの最後にスクリプトを置く、https://developers.google.com/speed/docs/best-practices/rtt#PreferAsyncResources

私見を非同期に比べていくつかの利点を持っています延期：

それはすべてのブラウザでは動作します
• （はい、でもIE;）あなたは、実行順序を保証
• ）
• あなたが$(document).readyまたは$(window).load
• あなたのスクリプトは、あなたのイメージが延期/非同期のよう
• をロードされる前に、DOMの準備ができてイベントをトリガすると、あなたのページには、すべてのスクリプト、
• 速く表示されますを実行することができます使用する必要はありません私が見ることができる唯一の欠点は、ブラウザがダウンロードを並列化することはできませんということです
• （mod_pagespeedのようなツールで）問題なく1つのファイルにすべてのjsをマージすることによって最適化することができ

をロードされています。 async/deferを代わりに使用する良い理由の1つは、完全に独立している（実行順序に依存する必要がない）スクリプトを特定のタイミングで実行する必要がない場合です。例：google analytics。