2012-11-01 7 views
9

HTML5はHTMLページで読み込みを延期できるスクリプトにdefer属性を導入しました。 deferは、DOMの前にロードする必要のないスクリプト(a.k.aは準備が整う前にDOMを混乱させない)に使用できます。ページ本体の最後に遅延スクリプトとスクリプトの違いは何ですか?

長い間、開発者は、DOMの前にロードする必要のないすべてのスクリプトをheadではなく、bodyタグの末尾に配置することを推奨しました。

deferの使用と長い練習アドバイスの違いは何ですか?最初のものは後者の代用ですか?

すべての回答に感謝します。ありがとうございました。

+0

遅延を使用してもスクリプトがまだダウンロードされていると思うし、ページ全体の読み込みが遅くなる可能性があります – Evgeny

+2

下部にスクリプトを置くという考えは、実行を遅らせるだけでなく、ダウンロードを遅らせることです。 – Evgeny

+0

ありがとう@ EugeneXa。 – rodrigoalves

答えて

1

asyncとdeferの両方のスクリプトは、パーサーを一時停止することなくすぐにダウンロードを開始し、両方ともオプションのonloadハンドラをサポートしてスクリプトに依存する初期化を実行する必要があります。

webkit blogから、動作はすべてのブラウザで必ずしも同じではありません。したがって、後でダウンロードされるので、スクリプトが最後に残っていれば、パフォーマンスは向上します。

編集2017:ブラウザのサポートがはるかに優れているので、おそらく頭にasync/deferスクリプトが残っている可能性があります。下に置くのはおそらくもっと安全な選択です。新しいブラウザでは、頭がおかずでもまだ早くダウンロードされます。

+0

男、ありがとうございました。 – rodrigoalves

+3

スクリプトを後でダウンロードするとパフォーマンスが向上するのはなぜですか?スクリプトができるだけ早くダウンロードされると、パフォーマンスは向上しないでしょうか? –

+0

@RuudLendersサポートが不安定になり、多くのブラウザがすぐにスクリプトをダウンロードするため、スクリプトがダウンロードされて実行されるまでレンダリングがブロックされるためです。サポートは4年半後にはるかに改善されましたが、ブラウザがダウンロードを開始する時間の差は(もしあれば)準備ができていれば、私はまだ体の端に置いています。 –

関連する問題