async属性【async attribute】

概要

async属性（async attribute）とは、HTMLの要素(タグ)の中で設定することができる属性(attribute)の一つで、スクリプトの実行とページの読み込み、表示処理を並行に行うよう指示するもの。script要素で指定する。“async” は “asynchronous” (非同期の)の略。

通常、WebブラウザはHTMLファイル中にscriptタグを発見すると表示処理を中断し、スクリプトを読み込んで実行する。実行が完了すると、続きの要素の読み込みと表示を再開する。取得や実行に時間のかかる「重い」スクリプトが含まれると、表示が完了するまで閲覧者は長時間待たされることになる。

一方、script要素にasync属性を指定すると、ページの読み込みと表示を継続しつつ、同時にスクリプトの読み込みと実行を並行して行う。論理属性であるため <script src="…" async></script> のように属性値の指定は不要だが、XHTMLの場合は async="async" のようにダミーの属性値が必要となる。

似た属性にdefer属性があり、スクリプトの実行をページ表示後に後回しにする。deferが指定されたスクリプトは読み込みだけ行い実行せず、ページの読み込みと表示が完了するのを待つ。ページの表示（DOMの構築）が完了すると、先頭から順番に実行が開始される。

(2023.1.23更新)