ブラウザ基礎知識
レンダリングエンジン
コンテンツ(HTML)を受け取って内容を描画する
レンダリングプロセス
HTML のレンダリングは動的
JavaScript
ユーザの入力
アニメーション
コンテンツが動的に更新されるのが Web の特徴
動的な更新
document.write() は直感的で便利だけど、HTML から差し替えてしまうので、
DOM -> Style -> Layout
の今までの流れがやり直しになってしまう
使うべきでない
JavaScript エンジン
最近のエンジンはだいたい #JIT コンパイラがついている 単なるインタプリタではなく、統計的に状況見て高速化
Public IP / PORT をクライアントが知っていて
サーバが接続を待っていて
そこに接続を要求して
接続を確立できたらデータの交換を行う
IP の知りかた
IP は DNS サーバに教えてもらう
https://example.com にアクセスする時、一度もアクセスされていなければ DNS Lookup
DNS Lookup はリクエスト先のドメインに応じて都度行われる
PORT は？
有名なプロトコルの場合はあらかじめ決まっている
http -> 80, https -> 443
該当のサーバにいきなり接続しない
3 回の接続確認を経て接続とする
https://scrapbox.io/files/67a1757309af00be6bcd384f.png
データのやりとり
接続が確立された後は HTTP プロトコルで
HTTP 通信は基本的にリクエストとレスポンス
HTTP リクエスト
リクエスト行
リクエストヘッダ
リクエストボディ
HTTP レスポンス
ステータス行
レスポンスヘッダ
レスポンスボディ
信頼性が高いプロトコル
パケロス時の再送制御や順序到達制御など、転送時の問題を解決してくれる
TCP の誤り訂正などの仕組みを自分たちのレイヤ上で再実装
接続内でデータ不整合が発生しても全体をストップさせない
データストレージ
データの永続化、Cache による最適化