May 2nd,2015
＃
“async”属性について
“async”属性はスクリプトをパースと並行して読み込み、使用可能になった時点で実行する属性です。
通常ブラウザはパースの途中でスクリプトを見つけるとパースを中断し、スクリプトを読み込んで実行するまでパースが再開されないため、その分ウェブページが表示されるのが遅れてしまいます。“async”属性を指定された“script”要素で埋め込まれるスクリプトはパースと並行して読み込みが行われるため、ウェブページの表示が遅れるのを防ぐことができます。
“async”属性を指定した場合でも“async”属性に対応していない古いブラウザを考慮して“defer”属性を指定することができます。この場合は“async”属性に対応しているブラウザでは“defer”属性は無視されます。
“script”要素の内容がデータブロックの場合は“async”属性を指定してはいけません。また、埋め込まれるスクリプトがモジュールスクリプトではない従来のJavascriptである場合、“src”属性を指定していない“script”要素にも指定してはいけません。
＃
＃
サンプルコード
<!DOCTYPE html>
<html lang="ja">
<head>
<link rel="icon" href="image/favicon.ico">
<meta name="robots" content="index,follow">
<meta name="keywords" content="バナナ,栄養素,産地">
<meta name="description" content="黄色くて栄養満点な果物であるバナナについて解説します。">
<link rel="stylesheet" type="text/css" href="css/stylesheet.css">
<script src="script/script.js" async></script>
<title>黄色いフルーツバナナ - 果物を食べる</title>
</head>
<body>
...
