Submit Search
Upload
The forefront of html5 implementation
•
12 likes
•
3,136 views
Satoshi Tanaka
Follow
Developers Summit 2012
Read less
Read more
Report
Share
Report
Share
1 of 24
Download now
Download to read offline
Recommended
Windowsストアアプリ開発ハンズオントレーニングに行ってきました 2012-09-22-lt
Windowsストアアプリ開発ハンズオントレーニングに行ってきました 2012-09-22-lt
Tomokazu Kizawa
20101127 Android Usability Seminar
20101127 Android Usability Seminar
Visso株式会社
Web制作で培ってきたFlashのリッチな表現力をモバイルアプリに
Web制作で培ってきたFlashのリッチな表現力をモバイルアプリに
invogue
Unity,Cocos-2dx,AIRを徹底比較!最新クロスプラットフォーム事情、FLASHを使ってiPhone/Androidアプリを作ろう!【とのさまラボ】
Unity,Cocos-2dx,AIRを徹底比較!最新クロスプラットフォーム事情、FLASHを使ってiPhone/Androidアプリを作ろう!【とのさまラボ】
schoowebcampus
【社内LT】AdobeAIRでアプリ
【社内LT】AdobeAIRでアプリ
Vitalify.Inc
デブサミ2013 【15-B-2】iOS/Android向け開発をビジュアルに!
デブサミ2013 【15-B-2】iOS/Android向け開発をビジュアルに!
hmimura_embarcadero
Delphi のひみつ!(2015/01/29 CROSS 2015)
Delphi のひみつ!(2015/01/29 CROSS 2015)
Jun Hosokawa
HTML5でハイブリットなアプリ開発をアレしてみた件
HTML5でハイブリットなアプリ開発をアレしてみた件
Tatsuo Kurita
Recommended
Windowsストアアプリ開発ハンズオントレーニングに行ってきました 2012-09-22-lt
Windowsストアアプリ開発ハンズオントレーニングに行ってきました 2012-09-22-lt
Tomokazu Kizawa
20101127 Android Usability Seminar
20101127 Android Usability Seminar
Visso株式会社
Web制作で培ってきたFlashのリッチな表現力をモバイルアプリに
Web制作で培ってきたFlashのリッチな表現力をモバイルアプリに
invogue
Unity,Cocos-2dx,AIRを徹底比較!最新クロスプラットフォーム事情、FLASHを使ってiPhone/Androidアプリを作ろう!【とのさまラボ】
Unity,Cocos-2dx,AIRを徹底比較!最新クロスプラットフォーム事情、FLASHを使ってiPhone/Androidアプリを作ろう!【とのさまラボ】
schoowebcampus
【社内LT】AdobeAIRでアプリ
【社内LT】AdobeAIRでアプリ
Vitalify.Inc
デブサミ2013 【15-B-2】iOS/Android向け開発をビジュアルに!
デブサミ2013 【15-B-2】iOS/Android向け開発をビジュアルに!
hmimura_embarcadero
Delphi のひみつ!(2015/01/29 CROSS 2015)
Delphi のひみつ!(2015/01/29 CROSS 2015)
Jun Hosokawa
HTML5でハイブリットなアプリ開発をアレしてみた件
HTML5でハイブリットなアプリ開発をアレしてみた件
Tatsuo Kurita
2014年くらいにやる Adobe AIR スマフォゲーム開発
2014年くらいにやる Adobe AIR スマフォゲーム開発
Tatsuya Koyama
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
Kazuaki Hidaka
2016/11/21 社内LT Android TV
2016/11/21 社内LT Android TV
Jun Hosokawa
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
一希 大田
BlackJack
BlackJack
yanoojapan
C#
C#
Naohiro Yoshikawa
PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料
Monaca
NfC ckaiki
NfC ckaiki
一佳 海木
Unity ネイティブプラグインの作成について
Unity ネイティブプラグインの作成について
Tatsuhiko Yamamura
HTML5/JavaScriptで作るAndroidアプリ開発seminar
HTML5/JavaScriptで作るAndroidアプリ開発seminar
kujirahand kujira
クリスマス直前!HTML5 で作る♥はじめての iOS & Android アプリ開発
クリスマス直前!HTML5 で作る♥はじめての iOS & Android アプリ開発
Osamu Monoe
Developers Summit 2013【14-E-3】Windows 8デザインガイド
Developers Summit 2013【14-E-3】Windows 8デザインガイド
Yuya Yamaki
あるゲームアプリケーションの構成とアップデートサイクル
あるゲームアプリケーションの構成とアップデートサイクル
Kentaro Iizuka
Windowsフォームで大丈夫か?一番良いのを頼む。
Windowsフォームで大丈夫か?一番良いのを頼む。
Yuya Yamaki
AndroidStudioのインストールをゼロからしてみる
AndroidStudioのインストールをゼロからしてみる
Shigeo Ueda
Unity sdk-plugin
Unity sdk-plugin
Elias Hasnat
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
Shinichi Tomita
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
Keisuke Todoroki
「フォームアニメーションで満足度向上!モバイルアプリ改善術」
「フォームアニメーションで満足度向上!モバイルアプリ改善術」
Embarcadero Technologies
デスクトップアプリ開発者が押さえておくべきWindows 8 時代の変革
デスクトップアプリ開発者が押さえておくべきWindows 8 時代の変革
Yuya Yamaki
Social Web Japan from goo
Social Web Japan from goo
Tomoya Hashimoto
Scrum changes an organization
Scrum changes an organization
Takeshi Kaise
More Related Content
What's hot
2014年くらいにやる Adobe AIR スマフォゲーム開発
2014年くらいにやる Adobe AIR スマフォゲーム開発
Tatsuya Koyama
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
Kazuaki Hidaka
2016/11/21 社内LT Android TV
2016/11/21 社内LT Android TV
Jun Hosokawa
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
一希 大田
BlackJack
BlackJack
yanoojapan
C#
C#
Naohiro Yoshikawa
PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料
Monaca
NfC ckaiki
NfC ckaiki
一佳 海木
Unity ネイティブプラグインの作成について
Unity ネイティブプラグインの作成について
Tatsuhiko Yamamura
HTML5/JavaScriptで作るAndroidアプリ開発seminar
HTML5/JavaScriptで作るAndroidアプリ開発seminar
kujirahand kujira
クリスマス直前!HTML5 で作る♥はじめての iOS & Android アプリ開発
クリスマス直前!HTML5 で作る♥はじめての iOS & Android アプリ開発
Osamu Monoe
Developers Summit 2013【14-E-3】Windows 8デザインガイド
Developers Summit 2013【14-E-3】Windows 8デザインガイド
Yuya Yamaki
あるゲームアプリケーションの構成とアップデートサイクル
あるゲームアプリケーションの構成とアップデートサイクル
Kentaro Iizuka
Windowsフォームで大丈夫か?一番良いのを頼む。
Windowsフォームで大丈夫か?一番良いのを頼む。
Yuya Yamaki
AndroidStudioのインストールをゼロからしてみる
AndroidStudioのインストールをゼロからしてみる
Shigeo Ueda
Unity sdk-plugin
Unity sdk-plugin
Elias Hasnat
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
Shinichi Tomita
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
Keisuke Todoroki
「フォームアニメーションで満足度向上!モバイルアプリ改善術」
「フォームアニメーションで満足度向上!モバイルアプリ改善術」
Embarcadero Technologies
デスクトップアプリ開発者が押さえておくべきWindows 8 時代の変革
デスクトップアプリ開発者が押さえておくべきWindows 8 時代の変革
Yuya Yamaki
What's hot
(20)
2014年くらいにやる Adobe AIR スマフォゲーム開発
2014年くらいにやる Adobe AIR スマフォゲーム開発
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
2016/11/21 社内LT Android TV
2016/11/21 社内LT Android TV
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
BlackJack
BlackJack
C#
C#
PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料
NfC ckaiki
NfC ckaiki
Unity ネイティブプラグインの作成について
Unity ネイティブプラグインの作成について
HTML5/JavaScriptで作るAndroidアプリ開発seminar
HTML5/JavaScriptで作るAndroidアプリ開発seminar
クリスマス直前!HTML5 で作る♥はじめての iOS & Android アプリ開発
クリスマス直前!HTML5 で作る♥はじめての iOS & Android アプリ開発
Developers Summit 2013【14-E-3】Windows 8デザインガイド
Developers Summit 2013【14-E-3】Windows 8デザインガイド
あるゲームアプリケーションの構成とアップデートサイクル
あるゲームアプリケーションの構成とアップデートサイクル
Windowsフォームで大丈夫か?一番良いのを頼む。
Windowsフォームで大丈夫か?一番良いのを頼む。
AndroidStudioのインストールをゼロからしてみる
AndroidStudioのインストールをゼロからしてみる
Unity sdk-plugin
Unity sdk-plugin
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
「フォームアニメーションで満足度向上!モバイルアプリ改善術」
「フォームアニメーションで満足度向上!モバイルアプリ改善術」
デスクトップアプリ開発者が押さえておくべきWindows 8 時代の変革
デスクトップアプリ開発者が押さえておくべきWindows 8 時代の変革
Viewers also liked
Social Web Japan from goo
Social Web Japan from goo
Tomoya Hashimoto
Scrum changes an organization
Scrum changes an organization
Takeshi Kaise
HBase at Ameba
HBase at Ameba
Toshihiro Suzuki
デブサミ関西2012[A-2]エンタープライズ開発におけるコラボレーション - JIRAによる顧客と開発チームのつなぎ方
デブサミ関西2012[A-2]エンタープライズ開発におけるコラボレーション - JIRAによる顧客と開発チームのつなぎ方
Yusuke Suzuki
大規模BIクラウドWebサービスの裏側
大規模BIクラウドWebサービスの裏側
Mitch Okamoto
【17-A-2】 10年後も通用する開発環境の秘訣 <デブサミ2012>
【17-A-2】 10年後も通用する開発環境の秘訣 <デブサミ2012>
智治 長沢
Viewers also liked
(6)
Social Web Japan from goo
Social Web Japan from goo
Scrum changes an organization
Scrum changes an organization
HBase at Ameba
HBase at Ameba
デブサミ関西2012[A-2]エンタープライズ開発におけるコラボレーション - JIRAによる顧客と開発チームのつなぎ方
デブサミ関西2012[A-2]エンタープライズ開発におけるコラボレーション - JIRAによる顧客と開発チームのつなぎ方
大規模BIクラウドWebサービスの裏側
大規模BIクラウドWebサービスの裏側
【17-A-2】 10年後も通用する開発環境の秘訣 <デブサミ2012>
【17-A-2】 10年後も通用する開発環境の秘訣 <デブサミ2012>
Similar to The forefront of html5 implementation
スマートフォンの方式検討に関する基礎知識
スマートフォンの方式検討に関する基礎知識
Yugo Yamamoto
改めて注目される2D アニメーションツール SpriteStudio ~国産2Dツールが(舶来ゲームエンジンの力を借りながら)世界へ~
改めて注目される2D アニメーションツール SpriteStudio ~国産2Dツールが(舶来ゲームエンジンの力を借りながら)世界へ~
Web Technology Corp.
モバイルコンテンツ制作を効 率化するツールを使いこなせ
モバイルコンテンツ制作を効 率化するツールを使いこなせ
Keisuke Todoroki
devsumi2012 17-D-1 Kinectで創る10年後のカタチ
devsumi2012 17-D-1 Kinectで創る10年後のカタチ
Kaoru NAKAMURA
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
Keisuke Todoroki
Windows 8 Developers カンファレンス
Windows 8 Developers カンファレンス
Kaoru NAKAMURA
どうなる?Windows 8時代の業務アプリ開発
どうなる?Windows 8時代の業務アプリ開発
Yuya Yamaki
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
Web Technology Corp.
Sneak Previews (ADC MEETUP ROUND 01)
Sneak Previews (ADC MEETUP ROUND 01)
Teiichi Ota
PhoneGapとハイブリッド開発
PhoneGapとハイブリッド開発
Andy Hall
Android Studio 2.2の紹介@Google I/O 2016東京報告会
Android Studio 2.2の紹介@Google I/O 2016東京報告会
mokelab
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Keisuke Todoroki
Herlockサービス紹介
Herlockサービス紹介
SONICMOOV CO.,LTD.
Devsumi 17 d-2
Devsumi 17 d-2
Daizen Ikehara
devsumi17 d-2
devsumi17 d-2
dikehara
Androidとは。ちょっと変った視点から
Androidとは。ちょっと変った視点から
demuyan
CEDEC 2013 - FlashによるアセットワークフローのHTML5やネイティブアプリへのうまい持ち込み方
CEDEC 2013 - FlashによるアセットワークフローのHTML5やネイティブアプリへのうまい持ち込み方
Andy Hall
Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)
Monaca
Androidとは何か
Androidとは何か
Koji Shigemura
HTML5でできるカメラアプリを実際に体験しよう
HTML5でできるカメラアプリを実際に体験しよう
Hideki Akiba
Similar to The forefront of html5 implementation
(20)
スマートフォンの方式検討に関する基礎知識
スマートフォンの方式検討に関する基礎知識
改めて注目される2D アニメーションツール SpriteStudio ~国産2Dツールが(舶来ゲームエンジンの力を借りながら)世界へ~
改めて注目される2D アニメーションツール SpriteStudio ~国産2Dツールが(舶来ゲームエンジンの力を借りながら)世界へ~
モバイルコンテンツ制作を効 率化するツールを使いこなせ
モバイルコンテンツ制作を効 率化するツールを使いこなせ
devsumi2012 17-D-1 Kinectで創る10年後のカタチ
devsumi2012 17-D-1 Kinectで創る10年後のカタチ
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
Windows 8 Developers カンファレンス
Windows 8 Developers カンファレンス
どうなる?Windows 8時代の業務アプリ開発
どうなる?Windows 8時代の業務アプリ開発
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
Sneak Previews (ADC MEETUP ROUND 01)
Sneak Previews (ADC MEETUP ROUND 01)
PhoneGapとハイブリッド開発
PhoneGapとハイブリッド開発
Android Studio 2.2の紹介@Google I/O 2016東京報告会
Android Studio 2.2の紹介@Google I/O 2016東京報告会
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Herlockサービス紹介
Herlockサービス紹介
Devsumi 17 d-2
Devsumi 17 d-2
devsumi17 d-2
devsumi17 d-2
Androidとは。ちょっと変った視点から
Androidとは。ちょっと変った視点から
CEDEC 2013 - FlashによるアセットワークフローのHTML5やネイティブアプリへのうまい持ち込み方
CEDEC 2013 - FlashによるアセットワークフローのHTML5やネイティブアプリへのうまい持ち込み方
Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)
Androidとは何か
Androidとは何か
HTML5でできるカメラアプリを実際に体験しよう
HTML5でできるカメラアプリを実際に体験しよう
The forefront of html5 implementation
1.
スマートフォンにおける
実装の最先端 HTML5実装の最先端 17-A-3 紀平 拓男 株式会社ディー・エヌ・エー CTO室 Developers Summit 2012
2.
自己紹介 紀平 拓男
DeNA CTO室 所属 @tkihira http://nmi.jp/ 会社を2つ設立した、シリアルアントレプレナー HTML5によるFlash Player『ExGame』を製作 「インストール」が大嫌い Developers Summit 2012
3.
今回の話題はスマートフォンに限ります PCブラウザに関する話は一切しません。 現在出来ることについて話します 将来こうなるかもしれない、ということは
別途その旨はっきりとお伝えします。 Developers Summit 2012
4.
とは?
とは HTML5とは HTML + JavaScript 今までに比べて豊富なAPI ドット単位の描画が可能なCanvas ベクターグラフィックスを扱えるSVG アニメーションなど豊富な表現力を持つCSS3 クライアントにデータを保存出来るlocalStorage etc… Developers Summit 2012
5.
描画能力の向上 曲線のある図形を描画することが出来るよ うになった
アニメーション能力も非常に高くなっている HTML5でFlash並のアニメーションが達成可 能に Developers Summit 2012
6.
Developers Summit 2012
7.
アプリ機能の拡充 Webアプリ機能の拡充 ApplicationCache機能
一度アクセスすれば、二度目からはキャッシュ を利用することが可能 localStorage機能 スマートフォン端末の中に、アプリケーション特 有のデータを保存することが可能 Developers Summit 2012
8.
iPhone専用 http://nmi.jp/ds/
Developers Summit 2012
9.
しかしアプリには敵わない アプリにくらべて劣っている点
3D 音楽 速度 Developers Summit 2012
10.
と音楽 3Dと音楽 OpenGLが使えない
WebGLはFirefox for mobileのみサポート 音楽に制限が多い 音のタイミング調整が非常にシビア iPhoneは、画面がタッチされたタイミングでのみ 音楽の再生が可能 WindowsPhoneとiPhoneは、同時に2つの音 源を鳴らせない Developers Summit 2012
11.
速度 HTML5の実行速度は、遅い
描画が遅い JavaScriptの実行が遅い Developers Summit 2012
12.
描画手段 HTML5の描画手段
Canvas: ラスターグラフィックス SVG: ベクターグラフィックス CSS3: 変形やアニメーション SVGはAndroid 2系列でサポート外 うまくやればCanvasで代用可能 Developers Summit 2012
13.
Canvas Android
> iPhone iOS4 drawImageが遅い、いかに回数を減らすか キャッシュに綺麗に乗せたら勝ち DOM構造でCanvasの上に物をのせない iOS5: GPU support! じゃじゃ馬 使いこなせば優秀だがそれまでが大変 Developers Summit 2012
14.
CSS3 悪女 とっつきやすいが、いきなり裏切る 基本的にGPUサポート
同時に動く物体数が増えると急激に重くなる 特にAndroidで、ブラウザバージョン間、端 末間の互換性がないことが多い 変形に関してはある程度互換性が期待できる アニメーションに関しては、、、 Developers Summit 2012
15.
メリット・デメリット Canvasが効力を発揮するのは
シチュエーションに応じて変わるアニメーション 同時に動くものが多い時 CSS3が効力を発揮するのは 1枚もののアニメーション 同時に動くものが少ない時 Developers Summit 2012
16.
JavaScript Engine
JavaScriptが重い理由 アルゴリズムが重い JITが重い GCが重い JITが重い=eval、クロージャの生成を疑う Developers Summit 2012
17.
Garbage Collection
AndroidにおいてFull GCが走ることがある 走るとシャレにならないほど止まる V8は世代別GCを利用している なるべく新世代にいるうちに参照を切る iOSは、メモリが足らなくなると落ちる Developers Summit 2012
18.
メモリとの戦い:王道編 メモリとの戦い:王道編 何度も使うメモリをあらかじめ確保する
頻繁に使う画像は、最初に全部ロードしておく 上限の決まっているオブジェクトは、初期化 時に上限まで確保しておく オブジェクトの生成の回数を減らす Developers Summit 2012
19.
メモリとの戦い:邪道編 メモリとの戦い:邪道編
の戦い:邪道 何とか実機上でのメモリ使用量を確認する どの部分がどれだけメモリを消費するか 注意:iPhone Simulatorは信用できない UIWebViewも信用できない Developers Summit 2012
20.
実機でのプロファイル ExGameなどでは自作プロファイルを使用
関数単位で count, total, self を取得 どの関数のプロファイルを取るかを指定 CanvasなどのビルトインAPIも指定可能 プロファイルのタイミングを設定可能 最初から、もしくは二本指タッチで開始・終了など 結果をサーバに送信 Developers Summit 2012
21.
実機でのデバッグ JsConsole
http://jsconsole.com/ nmi.jpでも紹介しています console.log iPhoneでも設定を操作すれば参照可能 console.error hack Developers Summit 2012
22.
ngCore on HTML5
Developers Summit 2012
23.
の将来 HTML5の将来 インストールソフトの時代は終わる
歴史はくりかえす 将来あるべき姿はどのようなものか 10年後に通用するエンジニアであるために Developers Summit 2012
24.
御清聴ありがとうございました。
紀平 拓男 @tkihira http://nmi.jp/ Developers Summit 2012
Download now