プログラミング Tips

ITエンジニアの雑記ブログ。
IT関連ニュースの考察や、プログラミングに関するTipsの備忘録として…
育児や日常の雑記帳としても、記事を投稿していきます。

プログラミングと日常生活に関する情報を発信しています。

カテゴリ:WEB > HTML5

WEBブラウザでサイトにアクセスする場合、URL欄に
"http://fizz.buzz/"
と入力すると、サーバーとブラウザ間では、GETの通信が発生する。

下記のようなページ遷移もGET通信で行われる。
  • リンクのクリック
  • ブックマークから移動
HTTPプロトコルで、ブラウザからサーバーへの要求を「リクエスト」、
リクエストに対してサーバーからの返答を「レスポンス」と呼ぶ。

URLを指定した場合のリクエストは、

"GET / HTTP/1.0"
のようになる。

リクエストは3つに分けられる。最初の「GET」が命令、真ん中の「/」は
ドキュメントルートのことを指す。

もし"http://fizz.buzz/index.html"と入力すると、リクエストは

"GET /index.html HTTP/1.0"
となる。ドメイン部分を除いたURLがリクエストとしてサーバーに送られる。

最後の"HTTP/1.0"は、クライアント側が使用しているHTTPのバージョンを示す。
ブラウザではなくTelnet端末やSSH端末でWEBサーバーに接続して、
"GET / HTTP/1.0"と入力して送信するとドキュメントルートが存在すれば
"HTTP/1.0 200 OK"のようなレスポンスが返る。

"/"を指定するだけでindex.htmlが返るのは、WEBサーバー側の仕様。
WEBサーバーには、多くでApatchが使われている。

一般的にApatchの初期設定では、"/"がリクエストされた際、ブラウザが
最初にアクセスするルートディレクトリに"index.html"や"index.php"があれば、
それをクライアントに返す。

この設定は、サーバー管理者側で自由に変更できる。
例えば…
  • ファイル名まで指定されていない時にはエラーを返す
  • ディレクトリにあるファイルの一覧を返す
などの設定も可能。
つまり厳密にいうなら、HTTPではドメイン名だけでなく、
ファイル名まで明記することが望ましい。

GETは文字通り「取得のため」の命令。
WEBサーバーは、クライアントブラウザから要求されたファイルが存在する場合、
"HTTP/1.0 200 OK"のレスポンスと、リクエストされたタイムスタンプ、
サーバープログラム名、要求されたファイルのサイズ、クッキー(cookie)などを含む
HTTPヘッダーをレスポンスし、続いてHTMLの内容を送信。

HTTPヘッダーに含まれる情報は決まっておらず、サーバーごとに異なる。
HTMLヘッダーの扱いに似ていて、ブラウザ上には表示されない。

またHTML内で、<img>タグを使って画像などの別ファイルを呼び出している場合、
ブラウザはその部分のHTMLを読み込む度に
"GET /img/hoge.jpg HTTP/1.0"
のような形で必要な分だけGET命令を送信する。

単純にWEBサイトを閲覧する場合、ほぼ100%がGET命令のみで成り立っている。





HTML5、JavaScriptとCSSを勉強するにあたって、
WEBブラウザについての情報からまとめる。

まずWEBブラウザの基本機能は下記3つ
  1. 通信ソフト
  2. レンダリングエンジン
  3. スクリプトエンジン

通信ソフト

WEBブラウザは、WEBサーバーとの通信仕様であるHTTPを使って、
サーバーに保管されているHTMLドキュメントをダウンロードする。


レンダリングエンジン

WEBサーバーから取得したHTMLドキュメントは、単純なテキストファイル。
WEBブラウザは、HTMLで参照している画像(<img>タグ)や、外部リンクされた
スクリプト(<script src>)、CSS(<link>)をファイルを順次ダウンロードする為、
WEBブラウザの通信ソフトの機能は、HTMLを理解しているということがわかる。

HTML本体と関連コンテンツをダウンロードしたら、WEBブラウザの画面で
見られるような形に成形する必要がある。

HTMLからタグを除去して、<h1>で囲まれた部分を大きな字に、<br>や<p>〜</p>で改行、
<table>による表組み、<img>部分への画像の書出しが必要。


スクリプトエンジン

HTMLを読める形に変換するだけでなく、CSSによる装飾もレンダリングエンジンが行う。
最新のCSSに対応しているかどうかはこのレンダリングエンジンの性能によって決まる。

JavaScriptのプログラムを動作させるための「スクリプトエンジン」も備えている。
JavaScriptプログラムは単純テキストで記述されていて、そのままCPUが解釈・実行できる
コンパイルされたプログラムではない。

よってWEBブラウザは、ソースコードを適宜コンパイルしながら、CPUが処理できる
コードに変換して動作させる必要がある。

スクリプトエンジンがソースコードを解釈して実行する速度が速いほど、ブラウザの閲覧は
快適ということになる。ブラウザ各社ごとに、速度を比較しているがこのスクリプトエンジンの
速度だ。

例えば、有名なスクリプトエンジンにGoogle Chromeが搭載ている「V8」がある。
V8は逐次コンパイルといった形を取らず、JavaScriptプログラムを読み込むと、
同時にCPUが理解できるネイティブコードへコンパイルすることで高速化を実現している。



↑このページのトップヘ