web on kernel

Web on Kernelfor HTML5-NADO @ 201204by Tomoya ASAI (dynamis)

last update on 2012.04.12

about:me

http:// dynamis.jp

@dynamitter

facebook.com/ dynamismailto: Tomoya ASAI <dynamis mozilla-japan.org>@

きょうのおはなし

ばずわーど

さいしんのぎじゅつ

うぇぶですまほ

あぷりをくばろう

AgendaHTML5WebAPIBoot to GeckoMarketplace

"HTML5"Review the Buzzword...

""HHTTMMLL55"" ってなぁに？

フォクすけに教えて！

The term "HTML5" is widely

used as a buzzword to refer to

modern Web technologies...

HTML 仕様書に書いてるよ！http://whatwg.org/html - Introduction

HTML 仕様書に書いてるよ！http://whatwg.org/html - Introduction

"HTML5" という用語は最新Web 技術を指すバズワードとして広く使われています

"HTML5" という用語は最新Web 技術を指すバズワードとして広く使われています

最新技術って何処までかな？

OfflineSupport

UserInteraction

Canvas Microdata

Web Workers

WebSockets

CSSSemanticElements

Multimedia Elements

HTML5Parser

Web Messaging

HTML5 Forms

WebGLWebRTC

DOM

SVG

Geolocation

ECMA5th

MathML

XHR

WHATWG W3C Other(主な)仕様策定の場:

W3C

仕様書名に

"HTM

L" を含む

HTM

L5 - W3C

HTML Living Standard - WHATWG

OfflineSupport

UserInteraction

Canvas Microdata

Web Workers

WebSockets

CSSSemanticElements

Multimedia Elements

HTML5Parser

Web Messaging

more...

HTML5 Forms

WebGLWebRTC

DOM

SVG

今の ""HHTTMMLL55"" は？

フォクすけに教えて！

Semantic Elements CSS Transforms ECMA5th

Multimedia Elements CSS Animations WebM Codec

Canvas 2D API SVG WebGL

Forms WOFF (Web Fonts) WebCL

Offline Events Event Listener (DOM) Typed Array

Drag & Drop API XHR Level 2 Audio Data API

Web Storage Indexed DB SQL DB (obsolate)

HTML5 Parser File API River Trail

Web Workers Geolocation SPDY

Web Sockets API Server-Sent Events Web Socket Protocol

Microdata Device Orientation ContentSecurityPolicy

Web RTC Battery Status ICC Color Profile

Semantic Elements CSS Transforms ECMA5th

Multimedia Elements CSS Animations WebM Codec

Canvas 2D API SVG WebGL

Forms WOFF (Web Fonts) WebCL

Offline Events Event Listener (DOM) Typed Array

Drag & Drop API XHR Level 2 Audio Data API

Web Storage Indexed DB SQL DB (obsolate)

HTML5 Parser File API River Trail

Web Workers Geolocation SPDY

Web Sockets API Server-Sent Events Web Socket Protocol

Microdata Device Orientation ContentSecurityPolicy

Web RTC Battery Status ICC Color Profile

W3C HTML5

Semantic Elements CSS Transforms ECMA5th

Multimedia Elements CSS Animations WebM Codec

Canvas 2D API SVG WebGL

Forms WOFF (Web Fonts) WebCL

Offline Events Event Listener (DOM) Typed Array

Drag & Drop API XHR Level 2 Audio Data API

Web Storage Indexed DB SQL DB (obsolate)

HTML5 Parser File API River Trail

Web Workers Geolocation SPDY

Web Sockets API Server-Sent Events Web Socket Protocol

Microdata Device Orientation ContentSecurityPolicy

Web RTC Battery Status ICC Color Profile

WHATWG HTML

Semantic Elements CSS Transforms ECMA5th

Multimedia Elements CSS Animations WebM Codec

Canvas 2D API SVG WebGL

Forms WOFF (Web Fonts) WebCL

Offline Events Event Listener (DOM) Typed Array

Drag & Drop API XHR Level 2 Audio Data API

Web Storage Indexed DB SQL DB (obsolate)

HTML5 Parser File API River Trail

Web Workers Geolocation SPDY

Web Sockets API Server-Sent Events Web Socket Protocol

Microdata Device Orientation ContentSecurityPolicy

Web RTC Battery Status ICC Color Profile

Firefox

点線は標準非搭載や限定的実装

"HTML5" の現状 "HTML5" >> HTML > HTML5

実装や仕様策定に伴い "HTML5" の領域は広がり続けている

Web がプラットフォームに 本格的アプリ開発が可能に

これで十分なの？

フォクすけに教えて！

"HTML5" ではまだできない システムステータス

電源, WiFi 情報, モバイル通信... 各種センサー

光センサー, 近接センサー... 低レベルハードウェア制御

USB, BlueTooth, NFC

ボクもいろいろ使ってみた〜い！

やりましょう。

あの人の写真は無断で使わないでおきます…

Web APINo More Native Apps...

http://arewemobileyet.com/

Web API Web の限界を押し進める

HTML5 などの基本 API 以外 API の総称であって定義はない

W3C では DAP などで標準化 実装と共に標準化も進めていく 一部別の WG に分かれるかも？

https://wiki.mozilla.org/WebAPI

昔からある Web API Geolocation (位置情報) Orientation (加速度センサー) Audio Data API WebGL (3D グラフィック) Camera API (WebRTC へ統合)

これらは既に Android 版 Firefox で実装済み

実装済みの Web API モバイル端末の基本機能中心

SMS, Telephony Settings, Contacts Vibration, Pointer Lock Battery Status (電池や充電) Resource Lock (スリープ禁止) Network Information

実装がまだ一部不完全な API も含む

現在実装中の Web API WebRTC (Camera, P2P など含む) Open Web Apps (アプリ管理) Idel, Power Management Mobile Connection,WiFi Information (無線情報)

Light Sensor (環境光センサー),Proximity Sensor (近接センサー)

...and more...

ex. 環境光を確認してみるvar count = 0;function output(ambient) { // ambient.value 属性で lux 単位の光強度が得られる var d = document.getElementById("d"); d.innerHTML = "<p> 計測回数: " + count++ + "<p> 現在値: " + ambient.value}

// devicelight イベントにリスナを追加するwindow.addEventListener("devicelight", output, true);

// Firefox 14 か 15 から利用可能になる見込み

実装予定の Web API Device Storage

USB file-reading も 低レベルハードウェア

Bluetooth, USB, NFC WebSocket 的になりそう

...and more...

ネイティブアプリにできることは何でも可能に

検討中の WebAPI Socket API (低レベル TCP) Time/Clock (時刻設定) Alarm Calendar Spellcheck ...and more...

もちろん API は標準化 W3C DAP (Device API) WG

ハードウェア操作やセンサー系 IETF/W3C WebRTC WG

マルチメディア系や P2P など Notification なども個別 WG また別の WG 増えるかも？

NFC, USB など低レベル系

the Web is the Platform Web こそがプラットフォーム

端末、OS、ブラウザに閉じない Write Once Run Anywhere?

これだけあれば…�

もちろん＊＊＊ができる

Boot to GeckoWeb Platform OS...

ステータスバーも(電波強度、電池残量...)

電話や SMS の送受信も

もちろん Firefox も

カメラを使うのも

写真やビデオを見るのも

その他いろんなアプリも

マーケットプレイスも

ステータスバーも(電波強度、電池残量...)

電話や SMS の送受信も

もちろん Firefox も

カメラを使うのも

写真やビデオを見るのも

その他いろんなアプリも

マーケットプレイスも

すべて Web 技術で！

Boot to Gecko Gecko を起動する OS

Linux Kernel 上に Gecko を Java VM などの中間レイヤなし

Web 技術が「ネイティブ」に HTML5, JavaScript, Web API...

Gecko は Firefox の描画エンジン、WebRT = Web Runtime

Boot to Gecko の３要素 Gaia

ユーザインターフェイス Gecko

アプリケーションランタイム Gonk

低レベルの OS 層 シンプルなカスタム Linux

Status 2012/03/09 - M2.1

Dogfood Release 2012/03/26 M2.5

Developer Preview Phone JSConf にて開発端末配布

Roadmap 2012/06/01 - M3

functional/Gecko complete 2012/06/29 - M4

feature/Gaia complete and code freeze

TBD - M4.5 major bug fixing / UI freeze

(これはダミー)

開発パートナーと製品化 Telefónica は本年中に製品化

世界 3～4 位のキャリア ホーム画面やアプリはカスタム

Deutsche Telekom (T-Mobile) Innovation Labs が開発に参加

Adobe, Qualcomm らも協力 PhoneGap の B2G 対応など

Mozilla Marketplacethe Web is the Platform

既存のプラットフォーム

現在のアプリケーションはそれぞれのプラットフォーム毎に作る必要がある

Web がプラットフォーム

プラットフォームとしての Web

Web がプラットフォームになれば業界標準技術でどこでも動作するアプリ環境に

Mozilla Marketplace デバイス・OS 横断マーケット

Web をアプリマーケットに マーケットで Web を分断しない

Web アプリの事前登録受付中 今年中に正式リリースを予定

http://hacks.mozilla.org/2012/02/mozillamarketplace-open-for-app-submissions/

Web アプリの登録 0. アプリを作る 1. AppManifest を書く 2. Marketplace に登録

0. アプリを作る

てきとーに作ってね。

1. AppManifest を書く// 最小限これくらいの JSON 書くだけ。

{ "version": "0.1", "name": "DNT Checker", "description": "行動追跡を拒否しているか確認できます", "developer": { "name": "dynamis", "url": "http://dynamis.jp" }}

2. Marketplace に登録

4/26 からユーザ向けのベータを開始予定

あくまでも予定。ずれても知りません。

続きは DevCon@Osaka でhttp://mozilla.jp/devcon

6/30 にまた大阪で！

続きは DevCon@Osaka で

http://mozilla.jp/devcon