ウェブページが表示される仕組み

ウェブページが表示されるまでの0.5秒に起きていること— 実は結構すごいんです ブラウザにURLを入れてから、ページが表示されるまで、体感では一瞬です。 その裏で何が起きているのかを知ると、 「サイトが重い」 「表示が崩れた」 といったトラブルの意味が分かるようになります。 ざっくり4段階で説明します。 ①住所の解決。 まずブラウザは、DNSという仕組みでドメイン名をIPアドレス（サーバーの住所）に変換します。 ②取り寄せ。 住所が分かったら、そのサーバーに「このページをください」とリクエストを送ります。サーバーは、ページの設計図であるHTMLというテキストを返します。実は、サーバーから届くのは完成した画面ではなく、材料と組み立て説明書なのです。 ③追加の買い出し。 HTMLを読み始めたブラウザは、 「デザイン指定のファイル（CSS）も要る」 「画像も要る」 と気づき、それぞれを追加で取り寄せます。 1ページの表示で、裏では数十回の通信が行われるのが普通です。 画像が重いとページ全体が遅くなる理由は、この買い出しに時間がかかるからです。 ④組み立て。 材料が揃った端から、ブラウザが画面を組み立てて描画します。表示が一瞬崩れてから整うことがあるのは、この組み立てが進行中だからです。 つまりウェブページとは、 「あなたのブラウザが、その場で毎回組み立てているもの」 です。 同じページでも、端末や環境で見え方が微妙に違うのはこのためで、私たち制作側が色々な画面サイズで確認する理由でもあります。 この4段階を知っておくと、次回書く「キャッシュ」の話が面白くなるので、続きもぜひ。