!
Unleash the Future
Web Technologies and Web OS @ html5j@Sendai
by Tomoya Asai (dynamis)
about:me
Tomoya ASAI
Mozilla Japan
Technical Marketing (Evangelist)
dynamis @ community
dynamis.jp
@dynamitter
facebook.com/dynamis...
topics:
Internet of Things
Smart Devices
Web Platforms
asm.js
Firefox OS
Internet of
Things
Internet of Things
あらゆるモノが繋がる未来
2020 年には 260 億 by Gartner
2020 年には 500 億 by cisco
2020 年には 2000 億 by Intel
!
予測値は違うがとにかく一杯!
Smart Devices
スマートフォン
世界の出荷台数は急成長中
2012 年に世界で 7 億台
2013 年に世界で 10 億台
新興国はまだまだ成長する
国内の出荷台数は頭打ちか
2012 年に国内で 2848 万台
2013 年に国内で 3031 万台
スマートデバイス
コンピュータ以外の情報機器
テレビも家電も何でも…
ネットに繋いで付加価値創造
機器間連携で付加価値創造
ウェアラブルも大人気
眼鏡、帽子、腕輪、指輪…
CES/MWC には各社が大量出展…
Web とスマートデバイス
Web 技術がより重要に
インターネット接続が基本
デバイスの種類が飛躍的に増加
業界標準の API が必要
HTML5 などの Web 技術がキーに
Web of Things...
Web Platforms
Web ブラウザ
ブラウザ = Web Platform
Web はアプリの実行環境
HTML5 はアプリの記述言語
Firefox は Device API も広く対応
Opera は独立したエンジンを持たなくなった…
独立起動する Web アプリ
Firefox
PC/Android で Web アプリに対応
Chrome
PC で Web アプリに対応
Chrome Apps 限定で API を提供
Firefox は多くの API をアプリ限定でなく普通...
Standalone Web App
Firefox や Chrome では Web アプリを
独立したアプリとしてインストール可能
Chrome Apps
Firefox Apps
増え続ける Web OS
多くの新 OS が Web ベース
Firefox OS, Chrome OS, Tizen IVI,
webOS などは Web アプリ中心
Windows 8, Tizen Mobile などは

ネイティブアプリ...
フル機能の Web OS
Firefox OS
OS の UI 含めてすべて Web ベース
Chrome OS
アプリは PNaCl など除いて Web ベース
webOS
TV 版 SDK 未公開だが多分 Web ベース
Tizen IVI...
多能なデバイスに広がるWeb OS
モバイル
Firefox OS, Tizen Mobile, Chrome? ...
テレビ
Firefox OS, webOS, Tizen TV? ...
デスクトップ
Chrome OS, Firefo...
Web OS に注目する業界
あらゆる業界の W3C グループ http://www.w3.org/Consortium/activities.html
テレビ、放送、家電
テレビ、放送、家電
セカンドスクリーン
自動車、車載端末
健康やライフサイエンス
政府、法律、教育
政府、法律、教育
ソーシャルビジネス
ビッグデータ
Web of Sensors
実績のある Web OS
Chrome OS
2011/05 商用展開開始
2013 米国のノート PC 20%
Firefox OS
2013/07 商用展開開始
半年で 15 ヶ国に展開
Uruguay Movistar - スマホの 30...
登場が待たれる Web OS
webOS
LG がスマートテレビに採用
スマホ用は OSS 化したが終息?
Tizen IVI, QNX (Blackberry)...
車載向けの OS を各社が開発中
Tizen Mobile
でませんでした...
webOS TV は今年発売予定
LG がリリースするスマートテレビの 70% に搭載予定
びーんばーどが可愛いので大いに期待しよう!
webOS TV は今年発売予定
LG がリリースするスマートテレビの 70% に搭載予定
びーんばーどが可愛いので大いに期待しよう!
webOS TV は今年発売予定
LG がリリースするスマートテレビの 70% に搭載予定
びーんばーどが可愛いので大いに期待しよう!
webOS TV は今年発売予定
LG がリリースするスマートテレビの 70% に搭載予定
びーんばーどが可愛いので大いに期待しよう!
webOS SDK 近日公開 (のハズ)
CES の会場では 2 月に公開すると言ってたが…
http://connectsdk.com/comingsoon
Tizen @ MWC 2014
発売されなかったスマホをメインに展示
Tizen @ MWC 2014
発売されなかったスマホをメインに展示
Tizen @ MWC 2014
Samsung × docomo 端末が無念そうでした。。。
オープンソース版と違ってかなり作り込まれていました (ソース非公開)
Web OS の現状
2013 年は商業的成功の始まり
Chrome OS ノートパソコン
Firefox OS スマートフォン
2014 年はマルチデバイス展開
Firefox OS がタブレット、テレビ、
パソコンなどに採用
webOS が...
Web Capability
Web Platform の課題
機能不足
デバイスやシステム系 API 不足
パフォーマンス
Java などに比べても遅かった
エコシステム
アプリ配信や課金が難しかった
デバイス操作ができなかった
マルチタッチ
ボタン&キー
マイク
カメラ
スピーカー
振動モーター
ジャイロ
Bluetooth
光センサー
近接センサー
加速度計
USB 接続
Semantic
Elements
Multi
Media
HTML5
Forms
Offline
SupportHTML5HTML5
Parser
Mouse,
Key ev.
XHTML5
WAI-
ARIA
W3C
Semantic
Elements
Multi
Media
Canva
s
HTML5
Forms
Offline
Support
Micro-
Data
Server-
Sent ev.
Web
Sockets
Web
Storage
HTML5...
Semantic
Elements
Multi
Media
Canva
s
HTML5
Forms
Offline
Support
Micro-
Data
Server-
Sent ev.
Web
Sockets
Web
Storage
Layou...
Semantic
Elements
Multi
Media
Canva
s
HTML5
Forms
Offline
Support
Micro-
Data
WebG
L
Indexed
DB
SVG
Server-
Sent ev.
Web
Soc...
Semantic
Elements
Multi
Media
Canva
s
HTML5
Forms
Offline
Support
Webm
H.264
Micro-
Data
WebG
L
Web
SQL
Indexed
DB
SVG
Serve...
http://www.w3.org/2009/dap/
http://www.w3.org/2009/dap/
http://www.w3.org/2012/sysapps/
http://www.w3.org/2012/sysapps/
すべて Web 技術で!
ステータスバー (通知、

電波強度、電池残量...)も
カメラやラジオも
ビデオや音楽の再生も
マーケットプレイスも
システムの環境設定も
ホーム画面や壁紙も
電話や SMS の送受信も
もちろん ブラウザ も
その...
TV や車載端末の API は?
W3C や業界団体で議論中
各自実装しながら標準化を進めて
いくスタイル
方向性はまだ不明確だが、今年は
TV や車載の Web API もガンガン
実装が進んでいく年になる
デスクトップのリモート実行
Desktop as a Service
OctaneCloud AMIs on AWS
2013/01 Mozilla, Amazon と協力して
AWS の GPU インスタンスを使う高
速マシンの画面を ORB...
asm.js
実用例: Unreal Engine 3
100 万行以上の C & OpenGL コードを 4 5 日で移植
LLVM + Emscripten で JavaScript (asm.js) に変換
epic CITADEL http://ww...
asm.js とは
JavaScript のサブセット仕様
既存 JavaScript エンジンで動作
高度に最適化可能なパターン
静的型で事前コンパイル可能
経験的に JIT する必要が無い形式
全体または関数単位で有効化
"use asm"...
asm.js コードサンプル
http://asmjs.org/spec/latest/
asm.js の設計思想
演算結果を固定型に
型の明示 (Annotation) も既存
JavaScript の範囲内で行う
TypedArray でメモリ管理
ガーベジコレクションを回避
機械生成が前提の設計
C 言語などから変換する対象
...
asm.js がもたらすもの
Web を Native の速度に
CrankShaft や IonMonkey の SSA 最
適化 JIT の効果を確実かつオーバー
ヘッドなく使えるように
予測可能なパフォーマンス
暗黙知 (ダーティハック)...
大規模アプリは遅かった
大規模アプリの処理速度では C 言語が圧倒的に速い
(小規模アプリや一部ベンチ限定で以前から高速)
2013/03 - http://kripken.github.io/mloc_emscripten_talk/#/19
C 言語に迫る高速化 (asm.js)
asm.js 導入直後で既に C の 2 倍遅い程度まで
(Java や C# の処理速度と同程度以上の水準に)
2013/03 - http://kripken.github.io/mloc_emscr...
実レベル: Box2D 物理演算エンジン
Box2D では C 言語の 2 倍遅い程度の速度
!
Chrome や IE でも通常の JS より asm.js が高速
Box2DWeb のコードが悪いって話を差し引いても十分
!
Java や ...
C 言語に迫る高速化 (asm.js)
asm.js 形式の JavaScript コード実行速度は
C 言語より数割遅い程度まで迫りまだ高速化中
2013/09 - http://kripken.github.io/mloc_emscript...
C 言語に追いついてきた!
殆どの処理で C 言語 (clang) の 1.5 倍以内
C (clan) < JavaScript (asm.js) < C (gcc) の場合も
2013/12 - https://hacks.mozilla....
asm.js にまつわる誤解
機械生成なんてナンセンス
CoffeeScript や TypeScript どころ
か 2006 年には GWT 出てる
特定パターンだけ高速は反則
ベンチを中心に特定パターンへの
最適化が積み重ねられてます
E...
asm.js にまつわる誤解
x = x¦0 とか非対応だと重い
既存エンジンが既に最適化していた
パターン (SunSpider crypto 等)
高速実行可能なコード生成を行っ
ていたツールからできた規則
特殊な JIT エンジンが必要
...
asm.js にまつわる誤解
asm.js は新しい技術
高速コード生成対象パターン
既存の最適化 JIT (CrankShaft や
IonMonkey) でコンパイルされる
asm.js は新しい仕様
JavaScript のサブセット

...
asm.js にまつわる誤解
"use asm" での AOT は反則
型の変わらないコードに対しては元々
原理的には AOT 可能 (だが大変)
機械生成で AOT 可能と保証できる
なら経験則で判別する必要ない
ES6 の Math.imu...
asm.js にまつわる誤解
PNaCl との一騎打ち
C++ で書いたコードを高速に
Web で動かすという目的は一緒
HTML5 同様に既存 JS との互換性
を重視したアプローチが asm.js
PNaCl の成否に依らず JS の一部
...
Faster
JavaScript
asm.js がまだ C より遅い理由
コンパイルタイム
避けられないオーバーヘッド
別スレッド AOT したりキャッシュ
したりして解消していく
単精度演算ができない
元々 JavaScript は倍精度のみ
SIMD 命令が使えない
4 デ...
Math.fround
引数を単精度に丸める
単精度演算の明示に利用
明示なしでもエンジンが判断す
る・できる場合もあるが限定的
SM, JSC, v8 で実装済み
https://developer.mozilla.org/docs/Web/...
Math.fround で単精度演算
!
!
https://blog.mozilla.org/javascript/2013/11/07/efficient-float32-arithmetic-in-
単精度演算命令が無いと遅い
倍精度の方が重い CPU あり
float32/float64 の相互変換
float32 を倍精度演算するには変換
オーバーヘッドが発生
倍精度の方がメモリを消費
メモリ関連処理時間に影響
単精度なら可能な最適化も
数値...
Math.fround による高速化
Math.fround の導入によって数値演算

ライブラリの速度が最大 60% 高速化
https://blog.mozilla.org/javascript/2013/11/07/efficient-f...
Math.imul
C 同様の 32bit 整数の掛け算
これも高速化を助ける関数
これを使わないとエンジンで常に
最適化できるとは限らない
https://developer.mozilla.org/docs/Web/JavaScript/R...
SIMD Module
128bit SIMD モジュール
TypedArray の拡張
対応データ型
float32x4, uint32x4
配列とビュー
Float32x4Array, Int32x4Array
既存 TypedArray の...
SIMD 命令が存在しないと遅い
複数データの並列同時計算
CPU 1 クロックで複数データ処理
同時に扱える数倍だけ速くなる
IA32/X64 の MMX/SSE など
ARMv7 の NEON など
CPU フル活用したいよね!
http:...
SIMD 命令の導入
!
https://github.com/johnmccutchan/ecmascript_simd
Conclusion
ステキな新機能一杯
コード量もバグも少なく
大規模開発にも対応可能に
書いてて楽しい言語に!
どんどん高速化が進む
JavaScript Fast Parts が増える
C 言語に迫る高速化が進行中
JavaScript ...
Always bet on
JavaScript!
Firefox OS
着実に成長している途中
Line などがあるのは勿論、Android では入手できなくなった Flappy Bird も
すっきりデザイン
完成イメージです
とてもクリーンなメール
完成イメージです
連絡帳や電話もシンプル
完成イメージです
動画と写真も同時撮影可能
完成イメージです
ギャラリーやタスクマネージャ
完成イメージです
すべての情報に1カ所から
完成イメージです
ロード中だけ大きいタイトル
完成イメージです
左右スワイプでアプリを切替
完成イメージです
通知は指の届く画面下から
完成イメージです
Firefox OS : Tizen : Android
左上のアプリが Web 読み込み型、右上のアプリがダウンロード型
Native
Framework
カーネル & HAL
Web Platform
Web
Framework
App F...
!
多数企業との共同開発・製品化
主要 21 キャリアが賛同
KDDI, Telefónica, Deutsche
Telekom、Telenor...
チップ&端末メーカー
Qualcomm, ARM, Spreadtrum
ZTE, Alc...
MWC 2014 でのパートナー発表
21 キャリアの他に端末メーカーや

SoC メーカーなどがパートナーに
MWC 2014 でのパートナー発表
21 キャリアの他に端末メーカーや

SoC メーカーなどがパートナーに
ローエンドを $25 で再定義
Spreadtrum が 3 つの SoC で Firefox OS 対応
リファレンスモデルのリテール価格は $25 から
ローエンドを $25 で再定義
Spreadtrum が 3 つの SoC で Firefox OS 対応
リファレンスモデルのリテール価格は $25 から
世界各国で順次展開中
15ヶ国で商用展開中
Telefónica、Deutsche Telekom、
Telenor、Telecom Italia
スペイン、ポーランド、コロンビ
ア、ベネズエラ、ドイツ、ブラジ
ル、メキシコ、ペルー、ウルグア
...
Firefox OS 端末販売は順調?
Telefónica は一部公表
ベネズエラ (Telefónica@2013/10)
スマートフォン販売の 12% 以上
コロンビア (Telefónica@2013/10)
スマートフォン販売の 9%...
販売台数はどれくらい?
パートナー企業に聞いてね
Mozilla が売ってるのではないので
アナリストの予測はある
2013 年の半年で 50 75 万
2014 年はその 6 10 倍?
目標値を公表するメーカーも
ZTE は 2014 年に...
更に多くの国で展開予定
MWC で 12 ヶ国を発表
アルゼンチン、コスタリカ、
エクアドル、エルサルバドル、
ドイツ、グアテマラ、ニカラ
グア、パナマ
クロアチア、チェコ共和国、
マケドニア、モンテネグロ
今年中に 30 ヶ国は越えそう?
2...
フォームファクタの展開
タブレット
Foxconn が最初の端末
スマートテレビ
Panasonic が製品化
パソコン
VIA が開発端末を販売中
発売中の Firefox OS 端末
商用端末は 3 機種発売済み
ZTE Open
Alcatel One Touch Fire
LG Fireweb
開発端末や PC など
Geeksphone Keon/Peak
APC (VIA) Pa...
!
ZTE Open
主な仕様:
Size: 114 x 62 x 12.5 mm

Display: 3.5 inch HVGA

CPU: MSM7225A 1 GHz

(Cortex-A5, Adreno 200)

RAM: 256 ...
!
Alcatel One Touch Fire
主な仕様:
Size: 115 x 62.3 x 12.2 mm

Display: 3.5 inch HVGA

CPU: MSM7227A 1 GHz

(Cortex-A5, Adreno...
LG Fireweb (D300)
主な仕様:
Size: 113.8 x 66.5 x 9 mm

Display: 4 inch HVGA

CPU: 1 GHz (型番未確認)

Memory: 2 GB (4GB?)
http://ww...
VIA - APC Paper / Rock
Firefox OS 標準搭載 PC
現在は開発者向け
CPU: Cortex-A9 900MHz
ボードは $59、箱入りで $99
HDMI 出力などあり!
Raspberry Pi クラスの ...
発表済みの Firefox OS 端末
商用端末は 7 機種発表
Huawei Y300
ZTE Open II, C
Alcatel One Touch Fire C, E, S, 7
開発端末
リファレンススマホ Flame
VIA / F...
!
Firefox OS Flame (リファレンス)
主な仕様:
Display: 4.5 inch FWVGA

CPU: MSM8210 Dual 1.2 GHz

(Cortex-A7, Adreno 302)

RAM: 256 MB...
ZTE Open C
主な仕様:
Display: 4 inch WVGA

CPU: MSM8210 Dual 1.2 GHz

(Cortex-A7, Adreno 302)

RAM: 512 MB

ROM: 4 GB
!
普通に進化し...
!
Alcatel One Touch Fire C
主な仕様:
Display: 3.5 inch HVGA

CPU: Dual 1.2 GHz
RAM: 512 MB

ROM: 2 GB
!
コンパクトサイズ端末
!
Alcatel One Touch Fire S
主な仕様:
Display: 4.5 inch qHD

CPU: Quad 1.2 GHz
LTE サポート
!
今回の発表では最高性能
Future of Mobile Privacy
Deutsche Telekom × Mozilla
色々実装中です
Privacy Panel
Location Blur
Guest Mode
Find My Fox
etc...
国内からもエコシステム拡大
仙台の皆さんも一緒にやりましょう!
Web で未来を切り開こう!
端末バリエーション拡大
販売する国も拡大
タブレットやテレビも登場
日本にもやってくる!
For More Info
Firefox OS コミュニティ!
http://FxOS.org
イベントやドキュメントをご案内
http://FxOS.org/ml
(Google Group のリンク: https://
groups.google.com/group...
主な Firefox OS イベント
Firefox OS 勉強会
東京、大阪、名古屋で開催
Gecko 勉強会
FxOS コードリーディング
Firefox OS ハッカソン
その他 ABC, DevSumi などの
各種イベントに参加
毎月...
!
FxOS コードリーディング Meetup
3/14 (金) 19:30∼22:00
Mozilla オフィスで開催
http://atnd.org/events/47848
!
気軽に集まってコード読んだ
り情報交換したりします
関西 Firefox OS 勉強会
3/15 (土) 13:00∼17:00
Mozilla の清水も話します
http://atnd.org/events/47737
アプリ間の通信とか
アプリ間のデータ共有とか
@chikoski が話します
仙台ではやらないの?
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Unleash The Future
Upcoming SlideShare
Loading in …5
×

Unleash The Future

1,474
-1

Published on

「Web プラットフォームで創る未来」
HTML5とか勉強会 in Sendai 2014 で使用したスライド
http://kokucheese.com/event/index/143144/

Published in: Technology
0 Comments
9 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,474
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
18
Comments
0
Likes
9
Embeds 0
No embeds

No notes for slide

Unleash The Future

  1. 1. ! Unleash the Future Web Technologies and Web OS @ html5j@Sendai by Tomoya Asai (dynamis)
  2. 2. about:me
  3. 3. Tomoya ASAI Mozilla Japan Technical Marketing (Evangelist) dynamis @ community dynamis.jp @dynamitter facebook.com/dynamis mailto: Tomoya ASAI <dynamis mozilla-japan.org>@
  4. 4. topics: Internet of Things Smart Devices Web Platforms asm.js Firefox OS
  5. 5. Internet of Things
  6. 6. Internet of Things あらゆるモノが繋がる未来 2020 年には 260 億 by Gartner 2020 年には 500 億 by cisco 2020 年には 2000 億 by Intel ! 予測値は違うがとにかく一杯!
  7. 7. Smart Devices
  8. 8. スマートフォン 世界の出荷台数は急成長中 2012 年に世界で 7 億台 2013 年に世界で 10 億台 新興国はまだまだ成長する 国内の出荷台数は頭打ちか 2012 年に国内で 2848 万台 2013 年に国内で 3031 万台
  9. 9. スマートデバイス コンピュータ以外の情報機器 テレビも家電も何でも… ネットに繋いで付加価値創造 機器間連携で付加価値創造 ウェアラブルも大人気 眼鏡、帽子、腕輪、指輪… CES/MWC には各社が大量出展…
  10. 10. Web とスマートデバイス Web 技術がより重要に インターネット接続が基本 デバイスの種類が飛躍的に増加 業界標準の API が必要 HTML5 などの Web 技術がキーに Web of Things...
  11. 11. Web Platforms
  12. 12. Web ブラウザ ブラウザ = Web Platform Web はアプリの実行環境 HTML5 はアプリの記述言語 Firefox は Device API も広く対応 Opera は独立したエンジンを持たなくなった…
  13. 13. 独立起動する Web アプリ Firefox PC/Android で Web アプリに対応 Chrome PC で Web アプリに対応 Chrome Apps 限定で API を提供 Firefox は多くの API をアプリ限定でなく普通の Web でも提供
  14. 14. Standalone Web App Firefox や Chrome では Web アプリを 独立したアプリとしてインストール可能 Chrome Apps Firefox Apps
  15. 15. 増え続ける Web OS 多くの新 OS が Web ベース Firefox OS, Chrome OS, Tizen IVI, webOS などは Web アプリ中心 Windows 8, Tizen Mobile などは
 ネイティブアプリがメイン
  16. 16. フル機能の Web OS Firefox OS OS の UI 含めてすべて Web ベース Chrome OS アプリは PNaCl など除いて Web ベース webOS TV 版 SDK 未公開だが多分 Web ベース Tizen IVI (!= Tizen Mobile) Intel 推進の IVI は Web ベース 注: Mobile はネイティブ依存強い Tizen はプロファイル毎に API セットや設計が違うので要注意
  17. 17. 多能なデバイスに広がるWeb OS モバイル Firefox OS, Tizen Mobile, Chrome? ... テレビ Firefox OS, webOS, Tizen TV? ... デスクトップ Chrome OS, Firefox OS ... 車載端末 Tizen IVI, QNX (BlackBerry) ...
  18. 18. Web OS に注目する業界 あらゆる業界の W3C グループ http://www.w3.org/Consortium/activities.html
  19. 19. テレビ、放送、家電
  20. 20. テレビ、放送、家電
  21. 21. セカンドスクリーン
  22. 22. 自動車、車載端末
  23. 23. 健康やライフサイエンス
  24. 24. 政府、法律、教育
  25. 25. 政府、法律、教育
  26. 26. ソーシャルビジネス
  27. 27. ビッグデータ
  28. 28. Web of Sensors
  29. 29. 実績のある Web OS Chrome OS 2011/05 商用展開開始 2013 米国のノート PC 20% Firefox OS 2013/07 商用展開開始 半年で 15 ヶ国に展開 Uruguay Movistar - スマホの 30% いずれも必要機能を備えた低価格端末が大きなシェアを獲得
  30. 30. 登場が待たれる Web OS webOS LG がスマートテレビに採用 スマホ用は OSS 化したが終息? Tizen IVI, QNX (Blackberry)... 車載向けの OS を各社が開発中 Tizen Mobile でませんでした。。。
  31. 31. webOS TV は今年発売予定 LG がリリースするスマートテレビの 70% に搭載予定 びーんばーどが可愛いので大いに期待しよう!
  32. 32. webOS TV は今年発売予定 LG がリリースするスマートテレビの 70% に搭載予定 びーんばーどが可愛いので大いに期待しよう!
  33. 33. webOS TV は今年発売予定 LG がリリースするスマートテレビの 70% に搭載予定 びーんばーどが可愛いので大いに期待しよう!
  34. 34. webOS TV は今年発売予定 LG がリリースするスマートテレビの 70% に搭載予定 びーんばーどが可愛いので大いに期待しよう!
  35. 35. webOS SDK 近日公開 (のハズ) CES の会場では 2 月に公開すると言ってたが… http://connectsdk.com/comingsoon
  36. 36. Tizen @ MWC 2014 発売されなかったスマホをメインに展示
  37. 37. Tizen @ MWC 2014 発売されなかったスマホをメインに展示
  38. 38. Tizen @ MWC 2014 Samsung × docomo 端末が無念そうでした。。。 オープンソース版と違ってかなり作り込まれていました (ソース非公開)
  39. 39. Web OS の現状 2013 年は商業的成功の始まり Chrome OS ノートパソコン Firefox OS スマートフォン 2014 年はマルチデバイス展開 Firefox OS がタブレット、テレビ、 パソコンなどに採用 webOS がテレビに採用 他にも何か出てくるかも?
  40. 40. Web Capability
  41. 41. Web Platform の課題 機能不足 デバイスやシステム系 API 不足 パフォーマンス Java などに比べても遅かった エコシステム アプリ配信や課金が難しかった
  42. 42. デバイス操作ができなかった マルチタッチ ボタン&キー マイク カメラ スピーカー 振動モーター ジャイロ Bluetooth 光センサー 近接センサー 加速度計 USB 接続
  43. 43. Semantic Elements Multi Media HTML5 Forms Offline SupportHTML5HTML5 Parser Mouse, Key ev. XHTML5 WAI- ARIA W3C
  44. 44. Semantic Elements Multi Media Canva s HTML5 Forms Offline Support Micro- Data Server- Sent ev. Web Sockets Web Storage HTML5HTML5 Parser Mouse, Key ev. XHTML5 Web Workers Web Messag- ing WAI- ARIA W3C WHATWG HTML
  45. 45. Semantic Elements Multi Media Canva s HTML5 Forms Offline Support Micro- Data Server- Sent ev. Web Sockets Web Storage Layou t Media Queries HTML5 CSS3~Trans form Anim ation Region s Filters HTML5 Parser Mouse, Key ev. XHTML5 Web Workers Web Messag- ing WAI- ARIA W3C WHATWG HTML
  46. 46. Semantic Elements Multi Media Canva s HTML5 Forms Offline Support Micro- Data WebG L Indexed DB SVG Server- Sent ev. Web Sockets Web Sockets Geo- location FileAP I Web Storage XHR2 Math ML Layou t Media Queries HTML5 CSS3~Trans form Anim ation Region s Filters HTML5 Parser Mouse, Key ev. ECMA Script CSP SPDY XHTML5 Orien- tation Web Workers Web Messag- ing DOM4 SMIL Vibra- tion XPath RSS OGP WAI- ARIA W3C WHATWG other Khronos ECMA IETF WOFF HTML DNT
  47. 47. Semantic Elements Multi Media Canva s HTML5 Forms Offline Support Webm H.264 Micro- Data WebG L Web SQL Indexed DB SVG Server- Sent ev. Web Sockets Web Sockets Geo- location FileAP I Web Storage XHR2 Math ML Web Audio Layou t Media Queries HTML5 CSS3~Trans form Anim ation Region s Filters HTML5 Parser Mouse, Key ev. Opus ECMA Script ECMA 6th USB CSP SPDY WebC L Web RTC Net Info MP3 Device Storage TCP Socket NFC File Sys Notifi- cation XHTML5 Orien- tation Web Workers Web Messag- ing DOM4 SMIL Vibra- tion Proxi- mity XPath RSS RDF OGP Schema .org WAI- ARIA W3C WHATWG other Khronos ECMA IETF WOFF Battery Status Radio Tel HTML DNT Flex Box
  48. 48. http://www.w3.org/2009/dap/
  49. 49. http://www.w3.org/2009/dap/
  50. 50. http://www.w3.org/2012/sysapps/
  51. 51. http://www.w3.org/2012/sysapps/
  52. 52. すべて Web 技術で! ステータスバー (通知、
 電波強度、電池残量...)も カメラやラジオも ビデオや音楽の再生も マーケットプレイスも システムの環境設定も ホーム画面や壁紙も 電話や SMS の送受信も もちろん ブラウザ も その他なんでも...
  53. 53. TV や車載端末の API は? W3C や業界団体で議論中 各自実装しながら標準化を進めて いくスタイル 方向性はまだ不明確だが、今年は TV や車載の Web API もガンガン 実装が進んでいく年になる
  54. 54. デスクトップのリモート実行 Desktop as a Service OctaneCloud AMIs on AWS 2013/01 Mozilla, Amazon と協力して AWS の GPU インスタンスを使う高 速マシンの画面を ORBX.js で高画 質リモート配信するサービスを開始 VMware Horizon View 2014/02 Google との提携で Chromebook のサポートを発表 DaaS でパフォーマンスや旧 OS アプリの互換性問題も解決可能
  55. 55. asm.js
  56. 56. 実用例: Unreal Engine 3 100 万行以上の C & OpenGL コードを 4 5 日で移植 LLVM + Emscripten で JavaScript (asm.js) に変換 epic CITADEL http://www.unrealengine.com/html5/
  57. 57. asm.js とは JavaScript のサブセット仕様 既存 JavaScript エンジンで動作 高度に最適化可能なパターン 静的型で事前コンパイル可能 経験的に JIT する必要が無い形式 全体または関数単位で有効化 "use asm" とファイルまたは関数 の冒頭に記載する "Fast Parts" (の更に一部) を明文化・定義したもの http://asmjs.org/
  58. 58. asm.js コードサンプル http://asmjs.org/spec/latest/
  59. 59. asm.js の設計思想 演算結果を固定型に 型の明示 (Annotation) も既存 JavaScript の範囲内で行う TypedArray でメモリ管理 ガーベジコレクションを回避 機械生成が前提の設計 C 言語などから変換する対象 C 言語に追いつくための設計 http://asmjs.org/
  60. 60. asm.js がもたらすもの Web を Native の速度に CrankShaft や IonMonkey の SSA 最 適化 JIT の効果を確実かつオーバー ヘッドなく使えるように 予測可能なパフォーマンス 暗黙知 (ダーティハック) にお別れ ams.js 形式で書けば必ず十分に高 速化されることが保証される 予測不能な JIT/GC を回避 "Fast Parts" である ams.js なら確実に速く http://asmjs.org/
  61. 61. 大規模アプリは遅かった 大規模アプリの処理速度では C 言語が圧倒的に速い (小規模アプリや一部ベンチ限定で以前から高速) 2013/03 - http://kripken.github.io/mloc_emscripten_talk/#/19
  62. 62. C 言語に迫る高速化 (asm.js) asm.js 導入直後で既に C の 2 倍遅い程度まで (Java や C# の処理速度と同程度以上の水準に) 2013/03 - http://kripken.github.io/mloc_emscripten_talk/#/19
  63. 63. 実レベル: Box2D 物理演算エンジン Box2D では C 言語の 2 倍遅い程度の速度 ! Chrome や IE でも通常の JS より asm.js が高速 Box2DWeb のコードが悪いって話を差し引いても十分 ! Java や CrossBridge (Flash C++ Compiler) と同等以上 2013/07 - http://kripken.github.io/mloc_emscripten_talk/sloop.html#/8
  64. 64. C 言語に迫る高速化 (asm.js) asm.js 形式の JavaScript コード実行速度は C 言語より数割遅い程度まで迫りまだ高速化中 2013/09 - http://kripken.github.io/mloc_emscripten_talk/sloop.html#/7
  65. 65. C 言語に追いついてきた! 殆どの処理で C 言語 (clang) の 1.5 倍以内 C (clan) < JavaScript (asm.js) < C (gcc) の場合も 2013/12 - https://hacks.mozilla.org/2013/12/gap-between-asm-js-and-native- performance-gets-even-narrower-with-float32-optimizations/
  66. 66. asm.js にまつわる誤解 機械生成なんてナンセンス CoffeeScript や TypeScript どころ か 2006 年には GWT 出てる 特定パターンだけ高速は反則 ベンチを中心に特定パターンへの 最適化が積み重ねられてます Emscripten などの機械生成コード 利用も広がっておりいずれにして も最適化対象となるパターン http://mozakai.blogspot.jp/2013/06/what-asmjs-is-and-what-asmjs-isnt.html !?
  67. 67. asm.js にまつわる誤解 x = x¦0 とか非対応だと重い 既存エンジンが既に最適化していた パターン (SunSpider crypto 等) 高速実行可能なコード生成を行っ ていたツールからできた規則 特殊な JIT エンジンが必要 既存エンジンの簡単な拡張 Firefox では 3 人月、Chrome も 数ヶ月で最適化対応を進めた http://mozakai.blogspot.jp/2013/06/what-asmjs-is-and-what-asmjs-isnt.html !?
  68. 68. asm.js にまつわる誤解 asm.js は新しい技術 高速コード生成対象パターン 既存の最適化 JIT (CrankShaft や IonMonkey) でコンパイルされる asm.js は新しい仕様 JavaScript のサブセット
 固定型は TypedArray で定義済み Emscripten 実行速度は Mozilla だけ 有利とならず透明性を高めるため http://mozakai.blogspot.jp/2013/06/what-asmjs-is-and-what-asmjs-isnt.html !?
  69. 69. asm.js にまつわる誤解 "use asm" での AOT は反則 型の変わらないコードに対しては元々 原理的には AOT 可能 (だが大変) 機械生成で AOT 可能と保証できる なら経験則で判別する必要ない ES6 の Math.imul に依存してる 32bit 整数演算を行う関数 (後述) 影響は限定的だし Polyfill あります asm.js 専用で生まれた訳じゃない http://mozakai.blogspot.jp/2013/06/what-asmjs-is-and-what-asmjs-isnt.html !?
  70. 70. asm.js にまつわる誤解 PNaCl との一騎打ち C++ で書いたコードを高速に Web で動かすという目的は一緒 HTML5 同様に既存 JS との互換性 を重視したアプローチが asm.js PNaCl の成否に依らず JS の一部 である asm.js への最適化は続く http://mozakai.blogspot.jp/2013/06/what-asmjs-is-and-what-asmjs-isnt.html !?
  71. 71. Faster JavaScript
  72. 72. asm.js がまだ C より遅い理由 コンパイルタイム 避けられないオーバーヘッド 別スレッド AOT したりキャッシュ したりして解消していく 単精度演算ができない 元々 JavaScript は倍精度のみ SIMD 命令が使えない 4 データ同時処理で 300% 高速化 などなど。
  73. 73. Math.fround 引数を単精度に丸める 単精度演算の明示に利用 明示なしでもエンジンが判断す る・できる場合もあるが限定的 SM, JSC, v8 で実装済み https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Math/fround
  74. 74. Math.fround で単精度演算 ! ! https://blog.mozilla.org/javascript/2013/11/07/efficient-float32-arithmetic-in-
  75. 75. 単精度演算命令が無いと遅い 倍精度の方が重い CPU あり float32/float64 の相互変換 float32 を倍精度演算するには変換 オーバーヘッドが発生 倍精度の方がメモリを消費 メモリ関連処理時間に影響 単精度なら可能な最適化も 数値演算によっては最適化可能 例えば x = 1024, y = 0.0001, z = 1024, (x+y)+z の結果は精度によって異なる
  76. 76. Math.fround による高速化 Math.fround の導入によって数値演算
 ライブラリの速度が最大 60% 高速化 https://blog.mozilla.org/javascript/2013/11/07/efficient-float32-arithmetic-in-javascript/ 0% 15% 30% 45% 60% Matrix Inversions Matrix Graphics Exponential Fast Fourier Transfrom Desktop (x86) Nexus 10 Nexus 4 Galaxy S3
  77. 77. Math.imul C 同様の 32bit 整数の掛け算 これも高速化を助ける関数 これを使わないとエンジンで常に 最適化できるとは限らない https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Math/imul
  78. 78. SIMD Module 128bit SIMD モジュール TypedArray の拡張 対応データ型 float32x4, uint32x4 配列とビュー Float32x4Array, Int32x4Array 既存 TypedArray のビューにも Intel, Google, Mozilla が積極的に取り組んでいるところ
  79. 79. SIMD 命令が存在しないと遅い 複数データの並列同時計算 CPU 1 クロックで複数データ処理 同時に扱える数倍だけ速くなる IA32/X64 の MMX/SSE など ARMv7 の NEON など CPU フル活用したいよね! http://wiki.ecmascript.org/doku.php?id=strawman:simd_number
  80. 80. SIMD 命令の導入 ! https://github.com/johnmccutchan/ecmascript_simd
  81. 81. Conclusion ステキな新機能一杯 コード量もバグも少なく 大規模開発にも対応可能に 書いてて楽しい言語に! どんどん高速化が進む JavaScript Fast Parts が増える C 言語に迫る高速化が進行中 JavaScript はこれまで通り不可能と言われた壁を乗り越え続けていく…
  82. 82. Always bet on JavaScript!
  83. 83. Firefox OS
  84. 84. 着実に成長している途中 Line などがあるのは勿論、Android では入手できなくなった Flappy Bird も
  85. 85. すっきりデザイン 完成イメージです
  86. 86. とてもクリーンなメール 完成イメージです
  87. 87. 連絡帳や電話もシンプル 完成イメージです
  88. 88. 動画と写真も同時撮影可能 完成イメージです
  89. 89. ギャラリーやタスクマネージャ 完成イメージです
  90. 90. すべての情報に1カ所から 完成イメージです
  91. 91. ロード中だけ大きいタイトル 完成イメージです
  92. 92. 左右スワイプでアプリを切替 完成イメージです
  93. 93. 通知は指の届く画面下から 完成イメージです
  94. 94. Firefox OS : Tizen : Android 左上のアプリが Web 読み込み型、右上のアプリがダウンロード型 Native Framework カーネル & HAL Web Platform Web Framework App Framework Android Runtime Dalvik WebKit Java アプリ ブラウザ アプリ Native Library Web アプリ WebKit Web アプリ Native アプリ OS etc.. DeviceAPI WebRT Web アプリ Packaged Webアプリ コアサービスGecko DeviceAPI SystemAPI Web に最適化 シンプル&スマート ライブラリ SGL etc. Native Interface カーネル & HAL カーネル & HAL X.org etc.
  95. 95. ! 多数企業との共同開発・製品化 主要 21 キャリアが賛同 KDDI, Telefónica, Deutsche Telekom、Telenor... チップ&端末メーカー Qualcomm, ARM, Spreadtrum ZTE, Alcatel, LG, Huawei, Sony Foxconn, Panasonic... パートナーとして公式発表している企業がすべてではない…
  96. 96. MWC 2014 でのパートナー発表 21 キャリアの他に端末メーカーや
 SoC メーカーなどがパートナーに
  97. 97. MWC 2014 でのパートナー発表 21 キャリアの他に端末メーカーや
 SoC メーカーなどがパートナーに
  98. 98. ローエンドを $25 で再定義 Spreadtrum が 3 つの SoC で Firefox OS 対応 リファレンスモデルのリテール価格は $25 から
  99. 99. ローエンドを $25 で再定義 Spreadtrum が 3 つの SoC で Firefox OS 対応 リファレンスモデルのリテール価格は $25 から
  100. 100. 世界各国で順次展開中 15ヶ国で商用展開中 Telefónica、Deutsche Telekom、 Telenor、Telecom Italia スペイン、ポーランド、コロンビ ア、ベネズエラ、ドイツ、ブラジ ル、メキシコ、ペルー、ウルグア イ、ハンガリー、ギリシャ、セル ビア、モンテネグロ、イタリア、 チリ 2014 年 02 月時点。今後更に多くのキャリア、多くの国で展開予定
  101. 101. Firefox OS 端末販売は順調? Telefónica は一部公表 ベネズエラ (Telefónica@2013/10) スマートフォン販売の 12% 以上 コロンビア (Telefónica@2013/10) スマートフォン販売の 9% 程度 ウルグアイ (Movistar@2013/12) スマートフォン販売の 30% キャリアのインタビュー記事から引用した数値です
  102. 102. 販売台数はどれくらい? パートナー企業に聞いてね Mozilla が売ってるのではないので アナリストの予測はある 2013 年の半年で 50 75 万 2014 年はその 6 10 倍? 目標値を公表するメーカーも ZTE は 2014 年に 100 万台以上
  103. 103. 更に多くの国で展開予定 MWC で 12 ヶ国を発表 アルゼンチン、コスタリカ、 エクアドル、エルサルバドル、 ドイツ、グアテマラ、ニカラ グア、パナマ クロアチア、チェコ共和国、 マケドニア、モンテネグロ 今年中に 30 ヶ国は越えそう? 2014 年 02 月時点。今後更に多くのキャリア、多くの国で展開予定
  104. 104. フォームファクタの展開 タブレット Foxconn が最初の端末 スマートテレビ Panasonic が製品化 パソコン VIA が開発端末を販売中
  105. 105. 発売中の Firefox OS 端末 商用端末は 3 機種発売済み ZTE Open Alcatel One Touch Fire LG Fireweb 開発端末や PC など Geeksphone Keon/Peak APC (VIA) Paper/Rock 2013 年 12 月時点
  106. 106. ! ZTE Open 主な仕様: Size: 114 x 62 x 12.5 mm
 Display: 3.5 inch HVGA
 CPU: MSM7225A 1 GHz
 (Cortex-A5, Adreno 200)
 RAM: 256 MB
 ROM: 512 MB http://www.ztedevices.com/product/smart_phone/2bcf2d56-0c9a-4129-a25c-acce58c8e502.html
  107. 107. ! Alcatel One Touch Fire 主な仕様: Size: 115 x 62.3 x 12.2 mm
 Display: 3.5 inch HVGA
 CPU: MSM7227A 1 GHz
 (Cortex-A5, Adreno 200)
 RAM: 256 MB
 ROM: 512 MB http://www.alcatelonetouch.com/global-en/products/smartphones/one_touch_fire.html
  108. 108. LG Fireweb (D300) 主な仕様: Size: 113.8 x 66.5 x 9 mm
 Display: 4 inch HVGA
 CPU: 1 GHz (型番未確認)
 Memory: 2 GB (4GB?) http://www.vivo.com.br/firefoxos/
  109. 109. VIA - APC Paper / Rock Firefox OS 標準搭載 PC 現在は開発者向け CPU: Cortex-A9 900MHz ボードは $59、箱入りで $99 HDMI 出力などあり! Raspberry Pi クラスの Android PC が Firefox OS に正式対応したもの
  110. 110. 発表済みの Firefox OS 端末 商用端末は 7 機種発表 Huawei Y300 ZTE Open II, C Alcatel One Touch Fire C, E, S, 7 開発端末 リファレンススマホ Flame VIA / Foxconn のタブレット 2013 年 12 月時点
  111. 111. ! Firefox OS Flame (リファレンス) 主な仕様: Display: 4.5 inch FWVGA
 CPU: MSM8210 Dual 1.2 GHz
 (Cortex-A7, Adreno 302)
 RAM: 256 MB 1GB (可変)
 ROM: 8 GB NFC, BT4, Dual SIM 対応
  112. 112. ZTE Open C 主な仕様: Display: 4 inch WVGA
 CPU: MSM8210 Dual 1.2 GHz
 (Cortex-A7, Adreno 302)
 RAM: 512 MB
 ROM: 4 GB ! 普通に進化したモデル
  113. 113. ! Alcatel One Touch Fire C 主な仕様: Display: 3.5 inch HVGA
 CPU: Dual 1.2 GHz RAM: 512 MB
 ROM: 2 GB ! コンパクトサイズ端末
  114. 114. ! Alcatel One Touch Fire S 主な仕様: Display: 4.5 inch qHD
 CPU: Quad 1.2 GHz LTE サポート ! 今回の発表では最高性能
  115. 115. Future of Mobile Privacy Deutsche Telekom × Mozilla 色々実装中です Privacy Panel Location Blur Guest Mode Find My Fox etc...
  116. 116. 国内からもエコシステム拡大 仙台の皆さんも一緒にやりましょう!
  117. 117. Web で未来を切り開こう! 端末バリエーション拡大 販売する国も拡大 タブレットやテレビも登場 日本にもやってくる!
  118. 118. For More Info
  119. 119. Firefox OS コミュニティ! http://FxOS.org イベントやドキュメントをご案内 http://FxOS.org/ml (Google Group のリンク: https:// groups.google.com/group/firefoxos)
  120. 120. 主な Firefox OS イベント Firefox OS 勉強会 東京、大阪、名古屋で開催 Gecko 勉強会 FxOS コードリーディング Firefox OS ハッカソン その他 ABC, DevSumi などの 各種イベントに参加 毎月 2~3 くらいのペースで開催されています
  121. 121. ! FxOS コードリーディング Meetup 3/14 (金) 19:30∼22:00 Mozilla オフィスで開催 http://atnd.org/events/47848 ! 気軽に集まってコード読んだ り情報交換したりします
  122. 122. 関西 Firefox OS 勉強会 3/15 (土) 13:00∼17:00 Mozilla の清水も話します http://atnd.org/events/47737 アプリ間の通信とか アプリ間のデータ共有とか @chikoski が話します
  123. 123. 仙台ではやらないの?
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×