Broadband Watch logo
バックナンバー

■ その116「DLNAの仕組み」
[2007/03/26]
■ その115「ドメインとActive Directory」
[2007/03/19]
■ その114「ワークグループができること」
[2007/03/12]
■ その113「WPSの仕組み」
[2007/03/05]
■ その112「Gopherの生い立ちと現在」
[2007/02/26]
■ その111「Wikiの使われ方」
[2007/02/19]
■ その110「文字コードとは」
[2007/02/05]
■ その109「IISの生い立ち」
[2007/01/29]
■ その108「NASの登場と一般への普及」
[2007/01/22]
■ その107「HomePNAのいろいろ」
[2007/01/15]
■ その106「Ogg Vorbisの成り立ち」
[2006/12/25]
■ その105「MIDIの原理とSMFの構造」
[2006/12/18]
■ その104「AIFFの構造」
[2006/12/11]
■ その103「WAVの構造と現状」
[2006/12/04]
■ その102「WMAの歴史」
[2006/11/27]
■ その101「AACの特徴」
[2006/11/20]
■ その100「MP3/MPEG Audioの仕組み」
[2006/11/13]
■ その99「HSDPAの仕組み」
[2006/11/06]
■ その98「H.264・MPEG-4 AVCの特徴」
[2006/10/30]
■ その97「IEEE 802.16e（モバイルWiMAX）の特徴」
[2006/10/23]
■ その96「TIFFの特徴」
[2006/10/16]
■ その95「PNGの現状と今後」
[2006/10/02]
■ その94「GIFの構造」
[2006/09/25]
■ その93「10GBASEの種類（2）」
[2006/09/11]
■ その92「10GBASEの種類」
[2006/09/04]
■ その91「GbEのいろいろ」
[2006/08/28]
■ その90「JPEGの特徴」
[2006/08/21]
■ その89「DivXの広がり」
[2006/08/07]
■ その88「MPEGの仕組み」
[2006/07/31]
■ その87「WMVのこれまで」
[2006/07/24]
■ その86「AVIの生い立ちとそのコーデック」
[2006/07/10]
■ その85「QuickTimeの変遷」
[2006/07/03]
■ その84「Realのこれまでと今後」
[2006/06/26]
■ その83「ShareとWinny」
[2006/06/19]
■ その82「DOCSISの仕組み」
[2006/06/12]
■ その81「SQLインジェクションの流れ」
[2006/06/05]
■ その80「RSSの動作」
[2006/05/29]
■ その79「Skypeの仕組み」
[2006/05/22]
■ その78「BitTorrentの特徴と今後」
[2006/05/15]
■ その77「Winnyの仕組みと現状」
[2006/05/08]
■ その76「WinMXの特徴」
[2006/04/24]
■ その75「Gnutellaの歴史と構造」
[2006/04/17]
■ その74「Napsterの歴史」
[2006/04/10]
■ その73「P2Pのいろいろ」
[2006/04/03]
■ その72「IEEE 802.11nの動向」
[2006/03/27]
■ その71「ActiveX Scriptingの動作」
[2006/03/20]
■ その70「Ajaxの仕組み」
[2006/03/13]
■ その69「DHTMLの動作」
[2006/03/06]
■ その68「Scriptの定義」
[2006/02/27]
■ その67「JavaScriptの仕組み」
[2006/02/20]
■ その66「Javaの動作」
[2006/02/13]
■ その65「RFCのプロセス」
[2006/02/06]
■ その64「ActiveX DocumentとActiveX Controlの違いと共通点」
[2006/01/30]
■ その63「ActiveX Controlの機能」
[2006/01/23]
■ その62「ActiveXを構成するもの」
[2006/01/16]
■ その61「Cookieの仕組みと用途」
[2005/12/26]
■ その60「malwareとその分類」
[2005/12/19]
■ その59「rootkitの動作」
[2005/12/12]
■ その58「CSSの役割」
[2005/12/05]
■ その57「HTMLの変遷」
[2005/11/28]
■ その56「PONとその種類」
[2005/11/21]
■ その55「FWAの仕組み」
[2005/11/14]
■ その54「DoSとDDoS」
[2005/11/07]
■ その53「SNMPとMIBの動作」
[2005/10/03]
■ その52「Jumbo Frameとフレームサイズ」
[2005/09/12]
■ その51「WPA2の仕組み」
[2005/09/05]
■ その50「WPAとWPA-PSKの違い」
[2005/08/29]
■ その49「WPAの仕組み」
[2005/08/22]
■ その48「WebDAVの動作」
[2005/08/08]
■ その47「OFDMAの仕組みとOFDMとの違い」
[2005/08/01]
■ その46「OFDMの仕組み」
[2005/07/25]
■ その45「WiMAXの特徴」
[2005/07/11]
■ その44「Wi-Fiの役割」
[2005/07/04]
■ その43「FTPの目的と動作」
[2005/06/27]
■ その42「UPnPの動作」
[2005/06/20]
■ その41「ネットマスクの仕組み」
[2005/06/13]
■ その40「ARPの機能」
[2005/06/06]
■ その39「DNSの原理」
[2005/05/30]
■ その38「デフォルトゲートウェイの役割」
[2005/05/23]
■ その37「MACアドレスの仕組み」
[2005/05/16]
■ その36「スイッチとその進化」
[2005/05/09]
■ その35「ルータによるメリット」
[2005/04/25]
■ その34「ブリッジの原理」
[2005/04/18]
■ その33「リピータの機能」
[2005/04/11]
■ その32「IPアドレスのクラス」
[2005/04/04]
■ その31「ブロードキャスト/マルチキャスト/ユニキャスト」
[2005/03/28]
■ その30「SMTP AUTHと認証の種類」
[2005/03/14]
■ その29「Submissionポートとスパムメール対策」
[2005/03/07]
■ その28「Outbound Port25 Blockingとは」
[2005/02/28]
■ その27「PGPの仕組み」
[2005/02/21]
■ その26「PKIと認証局」
[2005/02/14]
■ その25「公開鍵暗号方式とは」
[2005/02/07]
■ その24「共通鍵暗号とは」
[2005/01/31]
■ その23「SSHの仕組みと応用」
[2005/01/24]
■ その22「SSLの役割」
[2005/01/17]
■ その21「POP3とIMAP4の違い」
[2004/12/27]
■ その20「POP3の役割と機能」
[2004/12/20]
■ その19「SMTPの機能と問題点」
[2004/12/13]
■ その18「SPIとパケットフィルタリング」
[2004/12/06]
■ その17「LANの概念とその広がり」
[2004/11/29]
■ その16「SIPの役割」
[2004/11/15]
■ その15「プロキシの利用」
[2004/11/08]
■ その14「VoIPの仕組み」
[2004/11/01]
■ その13「イーサネットとは」
[2004/10/25]
■ その12「IP/TCP/UDP/ICMPとは」
[2004/10/18]
■ その11「DHCPの役割」
[2004/10/04]
■ その10「MIMOとは」
[2004/09/27]
■ その9「DMZとその効果」
[2004/09/13]
■ その8「ファイアウォールとは」
[2004/09/06]
■ その7「NATとNAPTの違いとIPマスカレード」
[2004/08/30]
■ その6「VPNとVPNパススルーの仕組み」
[2004/08/23]
■ その5「無線LANの問題とWEP」
[2004/08/09]
■ その4「IEEE 802.11a/b/gって何を意味しているの？」
[2004/08/02]
■ その3「ダイナミックDNSって？」
[2004/07/26]
■ その2「グローバルIPアドレスとプライベートIPアドレス」
[2004/07/12]
■ その1「PPPoEって何だろう？」
[2004/07/05]

その69「DHTMLの動作」


■ DHTMLって何？

　このところScript関連の話が続いているので、その延長でDHTMLについて説明をしたいと思います。DHTMLはDynamic HTMLの略で、Webページに対話性（Interactive）を持たせるためのものです。これに似た技術で最近流行しているものに次回に取り上げる「Ajax（Asynchronous JavaScript + XML）」もあります。

　どちらの技術も根底にあるのは「サーバーとWebブラウザが同期して通信しながら処理を進めてゆくのは遅すぎる」ということに対しての回答です。ただ、その実現方法や実現できることそのものは異なっており、基本的には別の技術と考えて良いでしょう。


図1：一般的なブラウザとサーバーの通信
　DHTMLの根底にあるのは、「サーバーに負荷をかけたり、プラグイン（FlashやMovieなどがその代表例でしょう）を使用せずに、WebブラウザとScript（JavaScriptだったりActiveX Scriptだったりします）だけで可能な処理を増やそう」という考え方です。

　図1は非常にプリミティブなWebブラウザとサーバーの関係です。要するにWebブラウザがページ要求を出すと、サーバーは要求のあったページを取得し、それをWebブラウザに転送します。静的なページ、例えば、今ご覧になっているこのページがその代表でしょう。上の方でバナーが動いていたり、右や下にGoogle広告が出ていたりしますが、基本的には「表示して終わり」です。

　ところが、Broadband Watchのトップページに移動すると、ちょっと動きが出てきます。この場合、動きのあるのは右上の「記事検索」という部分です。ここでは、図2のように最初は静的なページを転送しますが、その後はユーザーの入力（この場合は検索キーワード）がサーバーに送られ、それを処理した後に結果を再びWebブラウザに返します（サーバー自身で処理する場合もあれば、別のサーバーに処理する場合もあります）。ただ、これは1回で終わりとは限らないわけで、延々と続く場合もあります。


図2：動きのあるページその1

図3：動きのあるページその2
　もっとも記事検索などは、最終的にはデータベースなどを動かさなければなりませんから、Webブラウザとサーバーが頻繁にやり取りするのは仕方ないと思いますが、これを省けるケースもあります。例えば、アンケートを入力するページで、「問1の答えがAなら問2へ、Bなら問4へ、Cなら問10へそれぞれ移動してください」という仕組みが続くようなページを何も考えずに作ると、図3のようになります。つまり、あらかじめ問1から全部の問を別ページにしておき、ユーザーの入力にあわせて次のページを表示するという仕組みです。この方式は簡単なのですが、一方で以下のような問題もあります。

・トラフィック自体が無駄に多くなる
・サーバーに無駄な負荷が発生する。加えて、サーバーの負荷が元々高い場合にはユーザへのレスポンスも悪くなる

　DHTMLを使うと、こうしたケースでトラフィック負荷とサーバー負荷、ユーザーレスポンスという3つの問題を同時に解決することができます。具体的に言えば、図4のようにScriptで「問1の答えがAなら問2、Bなら問4、Cなら問10……」というルールを記述しておき、ユーザーの入力に合わせて、事前にサーバーから転送しておいたページを順次表示させるような方法です。こうすることにより、サーバーは最初の1回の転送だけを見れば済みますし、転送についてもまとめて1回で行なった方が負荷は少なくなります。また、ユーザーレスポンスも（サーバーの応答を待たなくても良い分）高速化されるというわけです。

　他にもデザイン上の都合で、例えばマウスポインタに合わせて何かを表示させたり、時刻やその他の状況に合わせてメッセージを変えるなどといった要求を、その都度サーバーに作業させていたら負荷が大きくてたまらないわけで、こうしたことも積極的にWebブラウザ側でやらせるのが流行になりつつあります。


図4：動きのあるページその3

■ DHTMLの問題点

　DHTMLの根本的な問題点として、「それほど複雑なことはできない」という点が挙げられます。例えば、図2のケースをDHTMLだけで処理しようするのは困難でしょう。あくまでDHTMLは「Webブラウザが保持しているデータを元に処理する」技術ですから、ないものはやはりサーバーから持ってこなければなりません。ただ、これは問題点といえるかどうか疑問で、そういう仕様なのだと割り切るべきでしょう。

　むしろ問題点は、（HTMLの時にも出てきた）非互換性です。元々、DHTMLはNetscape Communication 4.0とInternet Explorer 4.0で初めて搭載された技術ですが、この時点ですでに両者がサポートするDHTMLに互換性がなかったりします。

　そもそも、DHMTLはスタイルシートとJavaScript（IEだとJScriptということになります）の両方が必須となっていますが、スタイルシートもさることながら、JavaScriptとJScriptの互換性のレベルが低いため、両方で動くDHTMLはというと、非常に限られたものになります。一応、この両方で動作するDHTMLを特にCross Browser DHTMLと呼んだりしますが、このCross Browser DTMLだけですべてを実現するのは非常に困難で、結局内部でWebブラウザを判別して処理を分けるといった対策が事実上必須になっています。


　この非互換性はW3Cでも問題視されており、W3CではこのDHTMLを包括できる、より良い解決策として「DOM（Document Object Model：文章オブジェクトモデル）」の標準化の策定作業を行なっています（参考URL）。IEならば、5.0以降でDOMをサポートしていますし、MozillaやFirefoxなどでも当然DOMはサポートされています。

　ただ、DOMとDHMLは機能的にはかなり重複しますが、DOMはDHTMLとの互換性を重視しているわけではないので、DHTMLからDOMへの移行には少なからぬスクリプトの書き換えが発生します。このあたりが、いまだにDHTMLが（非互換性を維持したまま）普及し、DOMへの移行がなかなか進まない最大の要因なのかもしれません。


2006/03/06 11:03
槻ノ木 隆
　国内某メーカーのネットワーク関係「エンジニア」から「元エンジニア」に限りなく近いところに流れてきてしまった。ここ２年ほどは、企画とか教育、営業に近いことばかりやっており、まもなく肩書きは「退役エンジニア」になると思われる。（イラスト：Mikebow）
Broadband Watch ホームページ
Copyright (c) 2006 Impress Watch Corporation, an Impress Group company. All rights reserved.