ブラウザが最初の画面を表示するまでの処理(クリティカルレンダリングパス)では、<head>の中に属性なしで書いた <script src="app.js"> があると、HTMLの解析がそこで止まる。この要素にdefer属性を付けたときの動作として、正しいものはどれか。

正解：C. HTMLの解析と並行してダウンロードされ、解析が終わった後に、文書に書かれた順に実行される

ブラウザは、HTMLを解析してDOMを、CSSを解析してCSSOMを作り、2つを合わせて描画する内容を決め、要素の位置と大きさを計算(レイアウト)してから描画(ペイント)します。属性のないscript要素は、DOMを書き換える可能性があるため、ダウンロードと実行が終わるまでHTMLの解析を止めます。defer を付けると、ダウンロードは解析と並行して進み、実行は解析の後に、文書に書かれた順に行われます。async では、ダウンロードが終わりしだい実行されるので、順序は保証されません。

• A. これは async 属性の動作です。defer では、解析の後に書かれた順に実行されます。
• B. defer を付けてもスクリプトはすぐにダウンロードされ、利用者の操作を待たずに実行されます。
• C. 正しい。解析を止めずにダウンロードし、解析の後に書かれた順に実行します。