Empfohlen
Weitere ähnliche Inhalte
Andere mochten auch
Andere mochten auch (19)
Ähnlich wie 【17-A-5】ウェブアーキテクチャの歴史と未来
Ähnlich wie 【17-A-5】ウェブアーキテクチャの歴史と未来 (20)
Mehr von Developers Summit
Mehr von Developers Summit (20)
【17-A-5】ウェブアーキテクチャの歴史と未来
- 1. ウェブアーキテクチャの 歴史と未来 株式会社ディー・エヌ・エー 奥 一穂
- 2. 自己紹介 氏名： 奥 一穂 所属： 株式会社ディー・エヌ・エー システム統括本部 IT基盤部 2011年2月17日 ウェブアーキテクチャの歴史と未来 2
- 3. 主な仕事 Palmscape 1997年～ 後に Xiino に改名 Palm OS 用ウェブブラウザ (実質世界初) M.I.T. TR100/2002 受賞 オフラインコンテンツの配信プラットフォームを兼ねる Webアプリケーション統合開発環境の開発 IPA 未踏 2004 – スーパークリエータ 2011年2月17日 ウェブアーキテクチャの歴史と未来 3
- 4. 主な仕事 (2) 前職: サイボウズ・ラボ株式会社 Japanize Web UI の日本語化サービス パストラック リアルタイムアクセス解析／データマイニングサービス Q4M メッセージキュー (MySQLの拡張) 2011年2月17日 ウェブアーキテクチャの歴史と未来 4
- 5. アジェンダ ウェブアーキテクチャについて ウェブの何が新しかったか、および成功した理由 技術トレンドの推移と今後について 個人的経験をベースに語ります ※会社を代表した意見ではありません 2011年2月17日 ウェブアーキテクチャの歴史と未来 5
- 6. Palmscape とは? Palm OS用ウェブブラウザ 1997年8月公開 後に Xiino に改名 2011年2月17日 ウェブアーキテクチャの歴史と未来 6
- 7. Palmscape – 当初の動作環境 PalmPilot Pro CPU: 68328 @ 16MHz 初代NeXTの1/3程度の速度 160x160ドットのJPEGデコードに3秒 ワークメモリ: 10KB強 (TCP/IPスタックロード時) スクラッチメモリ: 最大約900KB 2011年2月17日 ウェブアーキテクチャの歴史と未来 7
- 8. Palmscape – 当時のネット回線 1990年代末のインターネット アナログモデム (〜56Kbps) or ISDN (128K) テレホーダイ 1990年代末のモバイルインターネット 赤外線公衆電話 (64Kbps) PHSモデム (32Kbps) PDCモデム (9.6Kbps) アナログモデム (〜10Kbps) 2011年2月17日 ウェブアーキテクチャの歴史と未来 8
- 9. Palmscape – Palm 向けの最適化 HTMLをレンダリング用VM命令にコンパイ ル vs. DOMツリー生成 画像を中間サーバでフォーマット変換 JPEGより軽いフォーマットへ 端末画面のサイズにあわせる 送信タイミングをHTMLより遅らせる 2011年2月17日 ウェブアーキテクチャの歴史と未来 9
- 10. Palmscape – 中間サーバによる最適化例 HTTP/1.0 200 OK ... <HTML> ... <UL CLASS="rectangle"> <LI><A HREF="/recruit/"><IMG SRC="/images/top/bnr/recruit.jpg" ALT="採 用情報" WIDTH="164" HEIGHT="38" EBDWIDTH="82" EBDHEIGHT="19" EBD="#1"> </A></LI> <LI><A HREF="http://developer.dena.jp/mbga/" TARGET="_blank"><IMG SRC="/images/top/bnr/devsite.jpg" ALT="DeNA デベロッパーサイト モバゲーオープ ンプラットフォーム" WIDTH="164" HEIGHT="38" EBDWIDTH="82" EBDHEIGHT="19" EBD="#2"></A></LI> ... </BODY> </HTML><EBDIMAGE MODE="9" NAME="1"><!--6EsZ6Evd6Esy/Czs7TIsEt9XGRNE3+ 0Z7TLtEzIsKxntMu0s7RlXE+koGegAPu5qAOw/AOwsAMruPu5q7hkAVwA+7lcZV+5EAOZ 2011年2月17日 ウェブアーキテクチャの歴史と未来 10
- 11. 15年間でのモバイル端末の進化 概ね1,000倍 CPU: CISC @ 16MHz ⇒ RISC 〜1GHz メモリ: 数MB ⇒ GBオーダー 回線: 〜32Kbps ⇒ 〜21Mbps cf. ムーアの法則 半導体集積度は18ヶ月〜24ヶ月で倍増 2011年2月17日 ウェブアーキテクチャの歴史と未来 11
- 12. ウェブの時代は続く HTTP/1.1 全盛 消滅したプロトコル: gopher, nntp ウェブメールだと不要: pop3, imap HTTP 上に定義される新プロトコル: REST, WebDAV HTTPng の中止 HTML の時代は続く HTML 5 (vs. Flash) XHTML 2 の廃案 WAP? (笑) 2011年2月17日 ウェブアーキテクチャの歴史と未来 12
- 13. Q. なぜウェブなのか? 2011年2月17日 ウェブアーキテクチャの歴史と未来 13
- 14. ウェブ以前のプロトコル プロトコルとアプリケーションが結合 メール: SMTP/POP3/IMAP4 ネットニュース: NNTP ファイル転送: FTP Gopher: ファイル検索 … 2011年2月17日 ウェブアーキテクチャの歴史と未来 14
- 15. ウェブのプロトコルはアプリケーション中立 HTTP – 「リソース」の転送プロトコル 「リソース」が何かは規定しない cf. Representational State Transfer (REST) HTML – ハイパーテキスト言語 何を記述するものかは規定しない ⇩ 通信プロトコルやマークアップ言語の変化を 待たずに、アプリケーションが進化可能 2011年2月17日 ウェブアーキテクチャの歴史と未来 15
- 16. Q. 「より良い」プロトコルが普及しないのは、 どうして? 2011年2月17日 ウェブアーキテクチャの歴史と未来 16
- 17. HTTP/1.x は（実は)効率的なプロトコル HTTP はテキスト+バイナリ混在プロトコル ヘッダは可読性の高いテキスト コンテンツは CPU 負荷の低いバイナリ ただしバイナリ長をテキストで表現 Content-Length, chunked エンコーディングのバイト数 cf. SMTP は古典的テキストプロトコル メッセージの終わりは CR LF . CR LF を探索して検出 仕様が明確で実装が容易かつ普及してい るため、新しいプロトコルの提案は困難 専用プロトコルの衰退 2011年2月17日 ウェブアーキテクチャの歴史と未来 17
- 18. 進化を続ける HTML 「ウェブ前」を彷彿とさせるタグは非推奨に <DIR>, <ISINDEX>, <LISTING>, … インタラクティブ性 Dynamic HTML (DOM操作), XHR 構造と体裁（デザイン）の分離 CSS そして HTML 5 へ 2011年2月17日 ウェブアーキテクチャの歴史と未来 18
- 19. ここまでのまとめ なぜ「ウェブの時代」なのか HTTP + HTML = アプリケーション中立な基盤技術 可読性・互換性と効率性を兼ね備えた HTTP 進化を続ける HTML 2011年2月17日 ウェブアーキテクチャの歴史と未来 19
- 20. ウェブ技術の変遷 2011年2月17日 ウェブアーキテクチャの歴史と未来 20
- 21. ウェブ技術の変遷 「ウェブ技術」のトレンドは4期に分類可能 マスコミ期 (Yahoo! 等) ブログ期 (livedoor blog 等) ソーシャル期 (Mixi 等) リアルタイム期 (Twitter 等) 時期毎に注目技術が変化 今はソーシャルとリアルタイムの中間あたり? 2011年2月17日 ウェブアーキテクチャの歴史と未来 21
- 22. マスコミ期 代表サイト例: Yahoo! 機能: 多数の読者に同一の情報を配信 静的配信が基本の時代 コア技術: httpd 一部差替 (テンプレート, Edge-side Includes) 技術指標: httpd の同時接続数・バンド幅 2011年2月17日 ウェブアーキテクチャの歴史と未来 22
- 23. マスコミ期 (2) Better FTP + Gopher としての利用 パフォーマンスに劣るものの、静的ファイルの配信な ら ftp + HTML でも実現…できなくは…ない 当時のトピック: SIMTEL20 (cdrom.com 等) の転送量が 417GB/日 を記録 – 1998年7月 ファイルアーカイブの運用は、今でも興味深い話題 cf. ftp-admin.blogspot.com スケールアップの生きた教科書 アクセスの多いファイルを移動平均で抽出してSSDに載せる等 2011年2月17日 ウェブアーキテクチャの歴史と未来 23
- 24. ブログ期 代表サイト例: アメーバブログ, livedoor blog, はてなダイアリー, … 画像や動画共有サイトも: Flickr, YouTube, … 機能: エンドユーザーが不特定多数に発信 変化: ウェブ経由での入力 「アプリケーションサービス」の時代 ホームページ作成ソフト ⇒ ブログサービスへの移行 データセットの増大 2011年2月17日 ウェブアーキテクチャの歴史と未来 24
- 25. ブログ期 (2) コア技術: オープンソース RDBMS 大量のデータを構造化して管理 (≠集計) over HTTP な分散ファイルシステム mogilefs 等 memcached RDBMS に入れづらい「ホット」（高頻度にアクセスされる データ）をキャッシュ シャーディング (水平分散) 一定数のユーザ毎に異なるデータストアを利用 2011年2月17日 ウェブアーキテクチャの歴史と未来 25
- 26. ブログ期 (3) – キャッシュのデータ一貫性問題 RDB とキャッシュのデータ一貫性維持が難 しい そもそもキャッシュを使う理由は RDB の同時接続数 あるいは qps の上限が低いから HandlerSocket plugin for MySQL (or mycached) は両者の問題を解決 ⇩ キャッシュ不要 ※よりアプリケーションよりの非正規化されたキャッシュが必要な場合は別途検討が必要 2011年2月17日 ウェブアーキテクチャの歴史と未来 26
- 27. ソーシャル期 代表サイト例: GREE, Mixi, モバゲータウン 「ソーシャル」なウェブサイト Twitter, ソーシャルゲーム系 より高頻度な更新 コア技術: フォロワーへの通知の捌き方 2011年2月17日 ウェブアーキテクチャの歴史と未来 27
- 28. ソーシャル期 (2) ブログとの違い: 書き込みが、より高頻度 （特に Twitter やゲーム) フォロワーへの通知が必要 書き込みコストはフォロワー数に依存 大規模環境（シャーディング）では、複数台のデータベース への書込が必要 耐障害性とレイテンシの２点が問題となる ⇩ 非同期書込 (ACID から BASE へ) 2011年2月17日 ウェブアーキテクチャの歴史と未来 28
- 29. ソーシャル期 (3) - 非同期書込の実現手法 2種類のモデル RDB + メッセージキュー + ワーカー Mixi, DeNA, livedoor 等では MQ として Q4M を利用 メリット: 柔軟、複雑な処理が可能 デメリット: 要プログラミング ワーカーを自動生成する手法も (cf. Incline) 非同期書込機能つき分散ストレージを使用 Cassandra 等 メリット: 処理の定義が簡単 デメリット: チューニング困難、複雑な処理ができない MQ + ワーカーモデルとの併用が必要になるケースも 2011年2月17日 ウェブアーキテクチャの歴史と未来 29
- 30. ソーシャル期 (4) – 図 (MQ + Worker) Queue Appサーバ Worker DB httpd Appサーバ DB Appサーバ 2011年2月17日 ウェブアーキテクチャの歴史と未来 30
- 31. ソーシャル期 (5) – 図 (分散ストレージ) (Queue) Appサーバ (Worker) (KVS) httpd Appサーバ (KVS) Appサーバ BASE 対応分散ストレージ 2011年2月17日 ウェブアーキテクチャの歴史と未来 31
- 32. ソーシャル期 (6) – 最適化手法 専用サーバによる高速化 cf. Mixi の足あと機能における検討例 http://alpha.mixi.co.jp/blog/?p=185 読み込み時にフォロワーリストで絞り込む 方法 (Pull型) MySQL におけるフォロワーリストの処理手法 http://labs.cybozu.co.jp/blog/kazuho/archives/2008/06/ mysql_direct_access.php 2011年2月17日 ウェブアーキテクチャの歴史と未来 32
- 33. リアルタイム期 代表サイト例: Twitter (Streaming), Facebook (PC / スマートフォンの) ソーシャルゲーム 機能: 準リアルタイムコミュニケーション PCやスマートフォンでは Comet (long-poll) が可能 一部のブラウザでは WebSockets が利用可能 2011年2月17日 ウェブアーキテクチャの歴史と未来 33
- 34. リアルタイム期 (2) いくつかのプログラミングモデルが存在 suspend & resume (Jetty Continuations, …) suspend & push (cometd, nginx, …) 独自 httpd サーバ (イベントドリブン) アプリロジック的には非同期書込の一種 ストレージ意外に他のクライアントへも書込 実装の選択肢は以下の２つ: メッセージキュー + ワーカーモデル httpd への通知プッシュ機能つき分散ストレージ もしリリースされれば 2011年2月17日 ウェブアーキテクチャの歴史と未来 34
- 35. リアルタイム期 (3) – 図 Queue Appサーバ Worker DB httpd Appサーバ DB Appサーバ 2011年2月17日 ウェブアーキテクチャの歴史と未来 35
- 36. リアルタイム期 (4) – 別解 Long polling の使用範囲が限定できるなら、 独自サーバで頑張るのも良い選択 スクリプト言語で実装しても問題ないレベル 数千クライアント程度の同時接続ならハンドリング可 能 http://labs.cybozu.co.jp/blog/kazuho/archives/2008/03/ fastr.php 2011年2月17日 ウェブアーキテクチャの歴史と未来 36
- 37. まとめ HTTP + HTML の時代は続く ウェブの進化とともに書き込みが増加 非同期書込が重要に キュー + ワーカーモデルの普及 RDB と NoSQL はパッケージングの違い やっていることは同じ 自社の技術スキルとストレージソフトウェアの実装を 天秤にかけた選択をすべき 2011年2月17日 ウェブアーキテクチャの歴史と未来 37
- 38. まとめ (2) 古いトレンド技術の変化をふりかえるべき 過去の事例から学べることはないか 同分野の最新の手法は何か 2011年2月17日 ウェブアーキテクチャの歴史と未来 38
- 39. ありがとうございました いっしょにウェブ技術の未来を切り拓いて いきましょう 2011年2月17日 ウェブアーキテクチャの歴史と未来 39