やあ。今日もどこかのコードレビューで「とりあえず`defer`つけとけ」なんて雑な指示を出して、なぜそうなるのか説明に窮していないかい？

フロントエンドエンジニアとして一歩先へ進み、パフォーマンスチューニングやCore Web Vitalsの最適化に本気で取り組むなら、ブラウザがHTMLをどう読み、どう止まり、どう走るのかをキッチリ解像度高く理解しておく必要がある。今回は、実務で毎日お世話になっているはずの `

まだ見えぬ未来の要素

もしブラウザがパースを続けながら並行してスクリプトを実行したらどうなるだろう。スクリプトがすでにパース済みのDOMを削除したり、まだ存在しないDOMを操作しようとしたりして、世界はカオスに包まれる。だからこそ、ブラウザは安全のために「HTMLパースの直列化」を強制するんだ。

外部ファイル (`

---

チームメンバーに伝えたい、シニアからの実践的Tips

最後に、現場で後輩エンジニアによく伝える、スクリプト周りの「ハマりどころ」をいくつか共有しておこう。

1. 動的に生成される `` のようなタグの内部にコードを直接書く場合、属性をつけても完全に無視される。インラインスクリプトを書くということは、その瞬間にブラウザの足を引っ張る（パースを止める）という強い意志表示なので、極力HTMLのヘッダーにインラインJSを書くのは避け、どうしても必要な初期化スクリプト以外は外部ファイルに逃がそう。