私のpolyfillやその他のスクリプトの設定は、それらが順番に読み込まれることを保証しますか？

Question

私はpolyfillを使ってPromiseを呼び出し、古いクライアントをフェッチします。私たちは、非同期の使用を推奨してポリフィルサービスからロード タグの属性を延期

：their website彼らは、スクリプトが現代のコードを実行する前に完全にロードされたことを確認するスクリプト・ローダまたはそのコールバックを使用することをお勧めします ノンブロッキングウェイでロードすると、ポリフィルのロードが完了する前または後に、自分の コードが実行されるかどうかがわからないことを意味します。

あなた自身 のコードを実行しようとする前にpolyfillsが存在していることを確認するために、あなたはより洗練されたスクリプト・ローダを使用し、https://cdn.polyfill.io スクリプトタグにonloadイベントハンドラを添付したり、単純に評価するために、私たちの コールバック引数を使用することができますすでに彼らはまだブラウザが「doesnのない限り、彼らは（文書に表示される順序で非同期ロードされていることを保証

しかし、両方のスクリプトでdeferを設定しないでください。polyfillsは がロードされているグローバルコールバックサポートを延期する）？

<script src="https://cdn.polyfill.io/v2/polyfill.min.js" defer></script> 
<script src="modernscript.js" defer></script> 

Answer 1

MDN documentationdefer属性によると、スクリプトのロードがいつ発生するだけでページの読み込み時間のポイントを定義します。あなたはそれを見ることができるcitatedてきたドキュメントから

：

あなた自身 のコードを実行しようとする前にpolyfillsが存在していることを確認するには、あなたはhttps://cdn.polyfill.ioにonloadハンドラを添付することができます スクリプトタグ

、1（deferスクリプトが実行された場合、それははっきりと見ることができません（この回答へのコメントの中に指摘したように）ので、）、可能なブラウザ実装の違いを念頭に置いてください。そのような動作に頼るのは最善の考えではないかもしれません。

だから、より良い方法は、いずれか、次のようになります。

1. 最初<script>タグに提案onloadハンドラを追加し、この内のコードをロードするためのダイナミック<script>タグを作成するには、いくつかのスクリプト・ローダ（例えばRequireJS）
2. を使用しますハンドラ
3. Promise polyfillとコードをバンドルし（webpackなどの手動またはバンドラを使用）、単一のバンドルとしてロードします。