『JavaScript』scriptタグはheadではなく、body最後に記述する理由

JavaScriptのコードを記述する際にscriptタグを記載すると思いますが

人によってはscriptタグをhead内に書き込んでいたり

body内最後に書き込んでいたりします。

body内最後に記述した方が良いという記事は多いですが、それではどうして、head内に記述する人もいるのでしょうか？？

今回はその理由に触れてみたいと思います。

『理想』body内最後に記述する理由とは

結論から言ってしまうと、scriptタグはbody内最後に記述する方法が正しいでしょう。

HTMLの構造を考えると分かりやすいのですが、ページを読み込む際に『上から下』に向かって描写が始まるので

bodyよりも上にあるhead内にscriptを記述すると

ページの描写が始まる前に、JavaScriptの処理を始めてしまいます。

するとパフォーマンスが落ちてしまって、結果的に『重いページ』になってしまうという訳ですね。

head内に記述する理由とは

しかし、それでも尚head内にscriptを記述する人もいますよね。

個人的に考えるその理由としては

scriptタグはHTML上に表示させる文字・数字では無くてプログラミングの処理方法なので

head内に記述した方が『コードの見た目』としては綺麗かなと思います。

しかも、head内に記述したからと言って劇的にページが重くなる訳でないなら

自分の書きたいように書いても、良いのかな？と思います。

まとめ

プログラミングを学習し始めの頃に、ちょっとだけ悩みがちなscriptタグ記述場所について書いてみました。

webサイトが育って大きくなってくると、それに伴ってデータが増えて重くなる傾向があります。

それらを見越して

基本的にはscriptタグはbody内最後に記述した方が良いでしょう。