ブラウザという「魔法の黒箱」を解体する:レンダリングパイプラインの深淵へ
Webフロントエンドの世界に足を踏み入れて数年、多くのエンジニアは「ReactやVueが何をしてくれるか」に終始しがちだ。だが、我々のような職人が真に目を向けるべきは、そのフレームワークが吐き出したDOMノードが、ブラウザという名の巨大なエンジンの中で、いかにして重力(ピクセル)に変換されるかという「物理現象」そのものだ。
今日は、ブラウザがHTMLを食ってから、ディスプレイに光を放つまでのレンダリングパイプラインを、現場の泥臭い戦場での知見を交えて解体していこう。
—
1. HTMLパースとDOM構築:バイト列からグラフ構造への変身
ネットワーク層から運ばれてきたバイト列は、まずトークナイザーによってタグや属性の断片(トークン)へと砕かれる。ここで重要なのは、HTMLパースは「止まらない」ということだ。
ブラウザはHTMLを読みながら即座にDOMを構築し始める。もし巨大な`

コメント