Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
OSC Shimane 2008
Tomoya Asai (aka. dynamis)
自己紹介 - 浅井 智也
•Mozilla Japan テクニカルマーケティング担当
•Web では dynamis (でゅなみす) として活動
•Firefox 1~3、Thunderbird 1~2 の L10N をリードしてきた
•SUM...
昨日・・・
3
Mockingbird
4
5
•Firefox のブラウジングを共有する拡張機能
•昨日までインターンさん達が開発していました
•今日からは独立したオープンソースプロジェクト
•新しい Web コミュニケーションツール
•試しながら聞いててください
Mockingbir...
6
•共有バーのタブのブラウジングを共有します
Mockingbird - ブラウジング共有
http://getmockingbird.org/
7
•URL、スクロール位置、範囲選択を共有します
Mockingbird - ブラウジング共有
http://getmockingbird.org/
Demo: Mockingbird
8
9
•このプレゼン中は shimane ルームを使用します
•shimane ルームではタブを開閉しないで!
•新規プロファイルを強く推奨 (導入ガイド参照)
•みんなで共有は testshimane ルームでどうぞ
•ネットワーク耐えられなか...
10
•Alpha 版のテスト公開なので、自己責任でどうぞ
•見られたくないページは共有しないでください
•ログインが必要なページも共有しないでください
•共有バーにドラッグ&ドロップしないでください
•共有バーでタブを復元しないでください
•...
今は昔・・・
11
1989
12
World Wide Web
13
14
1989 - World Wide Web
•ハイパーテキスト!
•HTTP + URL + HTML
•by Tim Berners-Lee
15
1989 - World Wide Web
•世界初のブラウザ World Wide Web (後の Nexus)
16
1989 - World Wide Web
•世界初の Web サーバ
1993
17
NSCA Mosaic
18
19
1993 - NCSA Mosaic
•画像のインライン表示をサポート
•Web を変化、普及させたブラウザ
•標準化より機能向上が優先に
•by Marc Andreessen
20
1993 - NCSA Mosaic (Mosaic 0.6b2)
21
1993 - NCSA Mosaic (Mosaic 3.0 on Vista)
1994
22
Netscape Navigator 1.0
23
24
1994 - Netscape Navigator 1.0
•Mosaic のコードを書き直した
•高速描画、FTP/News/Gopher 対応
•初の商業ベースブラウザ
•コードネーム: Mozilla
•by Netscape Co...
1995
25
Netscape Navigator 2.0
26
27
1995 - Netscape Navigator 2.0
•JavaScript をサポート
•Web にスクリプティングを導入
•Java、フレーム、フォント色なども
•Netscape バブル時代 (^^;
1997
28
Netscape Navigator 4.0
29
30
1997 - Netscape Navigator 4.0
•Dynamic HTML をサポート
•動的なページを作成可能に
•CSS もサポート
•ブラウザ戦争まっただ中
1998
31
mozilla.org
32
33
1998 - Mozilla.org
•オープンソースとして公開
•Gecko ベースで根本的にリデザイン
•XML ベースの UI 言語 XUL を導入
•Netscape では 1999 に RSS 0.9 を導入
2003
34
Mozilla Foundation
35
36
•誰もが簡単に Web を使えるように
•もっと快適に Web を使えるように
•Web の未来を作る技術を創造
•標準技術による Open Web を守る
2003 - Mozilla Foundation の使命
2005
37
Web 2.0 & Ajax
38
39
2005 - Web 2.0 & Ajax
•Web 2.0 や Ajax という用語を定義
•Google Suggest, Google Maps が話題に
•実用的 Web Application
•技術的には 1997∼2000 ...
2008
40
Firefox 3.0
41
2008 - Firefox 3 の位置づけは?
•Netscape − 将来のビジョンを打ち出した(けど・・・)
•Firefox 1 − ブラウザに選択肢を提供
•Firefox 2 − ブラウザの革新をリード
•Firefox 3 − ア...
史上最速のFirefox (時間、短い方が高速)
43
テスト環境: Windows Vista on Mac Mini (Core 2 Duo T5600, 2GB)
Internet Explorer 7 Firefox 2 Firefox...
44
2008 - Firefox 3.0
•Application Platform
•Canvas, SVG, DOM Storage, Offline Event
•Microformats, Microsummary, ... etc.
...
• 筆記体やリガチャ(合字)さらに古代文字などまでサポート
• カーニング(文字間隔調整機能)によって読みやすく
最高品質 のテキスト表示 (Web はテキスト中心)
45
280 Slides
Web アプリケーション版 Keynote
http://280slides.com/
46
Canvas + JavaScript (ContextFree.js)
47
数行から数十行程度のコードでアート
http://azarask.in/projects/algorithm-ink/
2009
48
Shiretoko
49
知床!?
50
Firefox 3.1
51
52
Firefox 3.1 - 新機能、改良点
•タブのプレビュー、一覧表示
•プライベートブラウジングモード
•ブックマーク管理の改善(タグ, 速度)
•<audio> <video> タグサポート
•CSS, SVG など標準仕様サポート...
TraceMonkey
53
54
Firefox 3.1 - TraceMonkey
•各種 JS ベンチマークの結果
55
Firefox 3.1 - TraceMonkey
•ブラウザ = アプリケーションプラットフォーム
•プラットフォームは OS からブラウザに
•ベンダー依存 or オープンスタンダード
- Web といえばオープンスタンダードでしょ?
•HTML, CSS, SVG, Canvas, Jav...
オープンスタンダード がオススメ
•真のマルチプラットフォーム
- iPhone などでも動作します Fennec にも期待を
•ベンダーの都合で仕様変更や開発停止しない
- 仕様変更毎にアプリ作り直すの無駄じゃない?
•アクセシビリティなどの...
201x
58
Mozilla Labs
59
60
•Mozilla Labs コンセプトシリーズ
•未来の Web を研究、提案、創造
•Mobile Firefox (携帯版 Firefox の UI コンセプト)
•Bookmark & History (ブックマークと履歴の UI)...
61
201x - MozLabs - Mobile Firefox Concept
62
201x - MozLabs - Bookmark & History
63
201x - MozLabs - Aurora (Future Browser)
NOW
64
Mobile Firefox
65
66
NOW - Fennec (Mobile Firefox)
67
NOW - Fennec (Mobile Firefox)
•今年中に Beta、来年早期にリリース
•Mozilla 1.9 ベースで Firefox 3 と同じ描画エンジン
•現開発版でも YouTube とか普通に見れます
•Win...
Ubiquity
68
69
•Mozilla Labs で開発中の新しいキーボード UI
•GUI の情報量と CUI の効率性を両立
•Aza Raskin らが開発 (Jeff Raskin の息子)
•Aza は Mozilla DevCon (11月に計画中...
Demo: Ubiquity
70
お ま け
71
Firefox 3 Hacks - O’Reilly Japan
•先月末に出版しました!
•全 Hack 独自書き下ろし!
•Mozilla 界のドリームチーム
- 下田 洋志 (あの Piro たん)
- 松澤 太郎 (もじら組組長)
- ...
Firefox 3 Hacks - O’Reilly Japan
3 ー Placesを使いこなす
7 ー マウスとキーボードを極める
10 ー ユーザプロファイルの秘密
15 ー ブラウザもマクロで自動化
18 ー Greasemonkey
...
Any Question?
74
(? ̄▽ ̄)
( ̄▽ ̄?)
75
dynamis@mozilla-japan.org
Thank You
Upcoming SlideShare
Loading in …5
×

Firefox と Mozilla のテクノロジー

944 views

Published on

200808
OSC Shimane でのプレゼン資料

  • Login to see the comments

Firefox と Mozilla のテクノロジー

  1. 1. OSC Shimane 2008 Tomoya Asai (aka. dynamis)
  2. 2. 自己紹介 - 浅井 智也 •Mozilla Japan テクニカルマーケティング担当 •Web では dynamis (でゅなみす) として活動 •Firefox 1~3、Thunderbird 1~2 の L10N をリードしてきた •SUMO (Firefox サポートサイト) 日本語版リーダー •MozillaZine.jp などのコミュニティ活性化サポート •昨日までインターンさん達の開発をサポートしてました 2
  3. 3. 昨日・・・ 3
  4. 4. Mockingbird 4
  5. 5. 5 •Firefox のブラウジングを共有する拡張機能 •昨日までインターンさん達が開発していました •今日からは独立したオープンソースプロジェクト •新しい Web コミュニケーションツール •試しながら聞いててください Mockingbird - ブラウジング共有 http://getmockingbird.org/
  6. 6. 6 •共有バーのタブのブラウジングを共有します Mockingbird - ブラウジング共有 http://getmockingbird.org/
  7. 7. 7 •URL、スクロール位置、範囲選択を共有します Mockingbird - ブラウジング共有 http://getmockingbird.org/
  8. 8. Demo: Mockingbird 8
  9. 9. 9 •このプレゼン中は shimane ルームを使用します •shimane ルームではタブを開閉しないで! •新規プロファイルを強く推奨 (導入ガイド参照) •みんなで共有は testshimane ルームでどうぞ •ネットワーク耐えられなかったらごめんなさい Mockingbird - ブラウジング共有 http://getmockingbird.org/
  10. 10. 10 •Alpha 版のテスト公開なので、自己責任でどうぞ •見られたくないページは共有しないでください •ログインが必要なページも共有しないでください •共有バーにドラッグ&ドロップしないでください •共有バーでタブを復元しないでください •その他いろいろややこしいことはしないでください Mockingbird - おことわりm(_ _)m http://getmockingbird.org/
  11. 11. 今は昔・・・ 11
  12. 12. 1989 12
  13. 13. World Wide Web 13
  14. 14. 14 1989 - World Wide Web •ハイパーテキスト! •HTTP + URL + HTML •by Tim Berners-Lee
  15. 15. 15 1989 - World Wide Web •世界初のブラウザ World Wide Web (後の Nexus)
  16. 16. 16 1989 - World Wide Web •世界初の Web サーバ
  17. 17. 1993 17
  18. 18. NSCA Mosaic 18
  19. 19. 19 1993 - NCSA Mosaic •画像のインライン表示をサポート •Web を変化、普及させたブラウザ •標準化より機能向上が優先に •by Marc Andreessen
  20. 20. 20 1993 - NCSA Mosaic (Mosaic 0.6b2)
  21. 21. 21 1993 - NCSA Mosaic (Mosaic 3.0 on Vista)
  22. 22. 1994 22
  23. 23. Netscape Navigator 1.0 23
  24. 24. 24 1994 - Netscape Navigator 1.0 •Mosaic のコードを書き直した •高速描画、FTP/News/Gopher 対応 •初の商業ベースブラウザ •コードネーム: Mozilla •by Netscape Communications
  25. 25. 1995 25
  26. 26. Netscape Navigator 2.0 26
  27. 27. 27 1995 - Netscape Navigator 2.0 •JavaScript をサポート •Web にスクリプティングを導入 •Java、フレーム、フォント色なども •Netscape バブル時代 (^^;
  28. 28. 1997 28
  29. 29. Netscape Navigator 4.0 29
  30. 30. 30 1997 - Netscape Navigator 4.0 •Dynamic HTML をサポート •動的なページを作成可能に •CSS もサポート •ブラウザ戦争まっただ中
  31. 31. 1998 31
  32. 32. mozilla.org 32
  33. 33. 33 1998 - Mozilla.org •オープンソースとして公開 •Gecko ベースで根本的にリデザイン •XML ベースの UI 言語 XUL を導入 •Netscape では 1999 に RSS 0.9 を導入
  34. 34. 2003 34
  35. 35. Mozilla Foundation 35
  36. 36. 36 •誰もが簡単に Web を使えるように •もっと快適に Web を使えるように •Web の未来を作る技術を創造 •標準技術による Open Web を守る 2003 - Mozilla Foundation の使命
  37. 37. 2005 37
  38. 38. Web 2.0 & Ajax 38
  39. 39. 39 2005 - Web 2.0 & Ajax •Web 2.0 や Ajax という用語を定義 •Google Suggest, Google Maps が話題に •実用的 Web Application •技術的には 1997∼2000 からの技術
  40. 40. 2008 40
  41. 41. Firefox 3.0 41
  42. 42. 2008 - Firefox 3 の位置づけは? •Netscape − 将来のビジョンを打ち出した(けど・・・) •Firefox 1 − ブラウザに選択肢を提供 •Firefox 2 − ブラウザの革新をリード •Firefox 3 − アプリケーションプラットフォーム (JavaScript 高速化、オフラインサポート etc) 42
  43. 43. 史上最速のFirefox (時間、短い方が高速) 43 テスト環境: Windows Vista on Mac Mini (Core 2 Duo T5600, 2GB) Internet Explorer 7 Firefox 2 Firefox 3 0ms 10,000ms 20,000ms 30,000ms 40,000ms JavaScript のパフォーマンス 3,678ms 10,000ms 34,092ms 9.3倍 高 速 (Apple の SunSpider JS Benchmark による) 0ms 125ms 250ms 375ms 500ms Gmail メッセージ読み込み時間 60ms 227ms 413ms 6.8倍 高 速 (Mozilla独自のテストによる)
  44. 44. 44 2008 - Firefox 3.0 •Application Platform •Canvas, SVG, DOM Storage, Offline Event •Microformats, Microsummary, ... etc. •これからの Web を支える基盤技術
  45. 45. • 筆記体やリガチャ(合字)さらに古代文字などまでサポート • カーニング(文字間隔調整機能)によって読みやすく 最高品質 のテキスト表示 (Web はテキスト中心) 45
  46. 46. 280 Slides Web アプリケーション版 Keynote http://280slides.com/ 46
  47. 47. Canvas + JavaScript (ContextFree.js) 47 数行から数十行程度のコードでアート http://azarask.in/projects/algorithm-ink/
  48. 48. 2009 48
  49. 49. Shiretoko 49
  50. 50. 知床!? 50
  51. 51. Firefox 3.1 51
  52. 52. 52 Firefox 3.1 - 新機能、改良点 •タブのプレビュー、一覧表示 •プライベートブラウジングモード •ブックマーク管理の改善(タグ, 速度) •<audio> <video> タグサポート •CSS, SVG など標準仕様サポート •新 JavaScript エンジン (TraceMonkey) •その他まだまだいっぱい・・・
  53. 53. TraceMonkey 53
  54. 54. 54 Firefox 3.1 - TraceMonkey •各種 JS ベンチマークの結果
  55. 55. 55 Firefox 3.1 - TraceMonkey
  56. 56. •ブラウザ = アプリケーションプラットフォーム •プラットフォームは OS からブラウザに •ベンダー依存 or オープンスタンダード - Web といえばオープンスタンダードでしょ? •HTML, CSS, SVG, Canvas, JavaScript... - IE で Canvas 使うには IECanvas とか - JavaScript は急速に進化中... 56 これからの Web の世界
  57. 57. オープンスタンダード がオススメ •真のマルチプラットフォーム - iPhone などでも動作します Fennec にも期待を •ベンダーの都合で仕様変更や開発停止しない - 仕様変更毎にアプリ作り直すの無駄じゃない? •アクセシビリティなどの問題も起きにくい •互換性や開発コストはライブラリで解決 57
  58. 58. 201x 58
  59. 59. Mozilla Labs 59
  60. 60. 60 •Mozilla Labs コンセプトシリーズ •未来の Web を研究、提案、創造 •Mobile Firefox (携帯版 Firefox の UI コンセプト) •Bookmark & History (ブックマークと履歴の UI) •Aurora (未来のブラウザの姿) 201x - Mozilla Labsのコンセプトが実現? http://labs.mozilla.com/projects/concept-series/
  61. 61. 61 201x - MozLabs - Mobile Firefox Concept
  62. 62. 62 201x - MozLabs - Bookmark & History
  63. 63. 63 201x - MozLabs - Aurora (Future Browser)
  64. 64. NOW 64
  65. 65. Mobile Firefox 65
  66. 66. 66 NOW - Fennec (Mobile Firefox)
  67. 67. 67 NOW - Fennec (Mobile Firefox) •今年中に Beta、来年早期にリリース •Mozilla 1.9 ベースで Firefox 3 と同じ描画エンジン •現開発版でも YouTube とか普通に見れます •Windows Mobile、Maemo Linux、LIMO •Symbian のサポートは検討中 (Cairo の Port が必要) •アドオンとかカスタマイズ性も当然健在
  68. 68. Ubiquity 68
  69. 69. 69 •Mozilla Labs で開発中の新しいキーボード UI •GUI の情報量と CUI の効率性を両立 •Aza Raskin らが開発 (Jeff Raskin の息子) •Aza は Mozilla DevCon (11月に計画中) に呼びます •http://www.toolness.com/wp/?p=54 NOW - Ubiquity
  70. 70. Demo: Ubiquity 70
  71. 71. お ま け 71
  72. 72. Firefox 3 Hacks - O’Reilly Japan •先月末に出版しました! •全 Hack 独自書き下ろし! •Mozilla 界のドリームチーム - 下田 洋志 (あの Piro たん) - 松澤 太郎 (もじら組組長) - 江村 秀之 (えむもじらの人) - 池田 譲治 (翻訳部門の重鎮) - dynamis (いま宣伝してる人) •Mozilla Japan 推奨図書 (^^; 72 帯についてはツッコミ無用
  73. 73. Firefox 3 Hacks - O’Reilly Japan 3 ー Placesを使いこなす 7 ー マウスとキーボードを極める 10 ー ユーザプロファイルの秘密 15 ー ブラウザもマクロで自動化 18 ー Greasemonkey 19 ー 拡張機能開発の基礎 20 ー 標準ライブラリ「FUEL」 を活用する 21 ー MozStorageでSQLite データベースを操作する 24 ー Placesデータベースへの 問い合わせ命令 26 ー JavaScriptコードモジュール 28 ー JavaScript製XPCOMコンポー ネントで特殊な処理を実現する 29 ー 拡張機能を安全に自動更新 できるようにする 31 ー Google Gears 32 ー DOM Storage 34 ー XULRunnerプラットフォーム 38 ー 5分でできるオリジナルブラウザ 39 ー XULアプリケーションの パッケージ化 42 ー Firebug徹底活用 43 ー Canvas 44 ー PNGでアニメーション 46 ー 最新のJavaScriptでコーディング 48 ー Firefoxをビルドする 51 ー Microformatsで Webセマンティクス 73 52 Hacks, 375+ Pages
  74. 74. Any Question? 74 (? ̄▽ ̄) ( ̄▽ ̄?)
  75. 75. 75 dynamis@mozilla-japan.org Thank You

×