読者です 読者をやめる 読者になる 読者になる

HTML5で出来ないことまとめ 2012年12月版

HTML5

本記事は、HTML5 Advent Calendar 2012 の12日目の記事です。なんとか本日中にあげれるか・・ アップできた!

業務やらイベントやら本やらで死ぬほど忙しいなか、無謀にもHTML5 Advent Calendarに参加してしまった@dsuketです。こんばんわ。

先月の段階ではここまで修羅場になるとは思わなかったのですが、師走は恐ろしいものですね。年末にこんな首を絞めるイベントが山ほど各所で行われているとは、つくづくエンジニアはM属性だと思いました。

本ネタは始めは「HTML5で出来ること」にしようかと思っていたのです。が、そんな話は山ほどある。もはや食傷気味ですよね。そこで逆転の発想で「出来ないこと」にすればいい!と閃いたわけです。さすが良い閃きだな−、俺冴えてる!と思ったのも束の間。念のためググってみると・・・「あれ?いっぱいあるぞ・・( ̄0 ̄;)」

しかし、検索上位に表示されるものをよく読んでみると古い内容が多く、もうそれできるよ(できそうだよ)というのも多くある。日々進化の早いこの業界、2,3年も経つと情勢が大きく変わりますよね。そこで今回は、その先人達の記事を参照しつつ「HTML5で出来ないこと 2012年12月版」としてお送りしたいと思います。

第13回 来るべきHTML5の世界へ(後編)

まず、下記の記事からみてみましょう。2010年12月なのでちょうど2年前の記事ですね。
第13回 来るべきHTML5の世界へ(後編)

HTML5でできないこと

また,マルチメディア機能では,Flashがストリーミング動画を複数のブラウザに表示できるのに対し,HTML5ではその対応ができません。これは,HTML5向けのビデオエンコーディング技術がブラウザメーカで統一されていないためで,Internet Explorer 9Safariなどは「H,264」を,MozillaOperaは「WebM」をサポートしています。さらに,動画機能についても,動画制御や著作権管理,フルスクリーン表示などに未対応であり,マルチメディア機能を中心に実装する動きが活発化する中,できないことも明らかになってきました。

ここで上げられているコーディックの問題は今もあります。GoogleH.264を長期的にサポートをしないと言いだした(GoogleがH.264問題を再説明、IEとSafariにはWebMプラグインを提供へ)かと思えば、MozillaH.264サポートを打ち出したり(Mozilla が H.264 をサポートへ、webM 一本化を断念)、一方OperaはMobileに限っては H.264をサポートしたり(Web specifications support in Opera products 英語版)と混乱の極みですが、これでモバイルでは主要なブラウザが全てH.264をサポートすることになりました。(デスクトップ向けではまだ)

記事中で次に触れている動画制御が、何を指しているのか分かりませんがシークやループも可能です(参考: HTML5のvideo/audio+JavaScript APIテクニック)。DRMは未だ解決していません。GoogleやMSが取り込んではいるようですが、標準化にはまだまだ遠そうです(GoogleとMicrosoftら、HTML5対応のコンテンツ暗号化APIの標準化を申請)。フルスクリーンについては Fullscreen API で標準化が進み、FirefoxChromeSafariでは既にサポートされています。

HTML5でアプリを開発するメリットとデメリット

次の記事はこちら。HTML5でアプリを開発するメリットとデメリット より

HTML5で出来ないことは以下の通り。

  • 写真/動画撮影
  • Bluetoothへのアクセス
  • Gyroscope
  • プッシュ通知
  • バイブレーション
  • メディアファイルへのアクセス
  • バックグラウンドで起動

写真/動画撮影については、WebRTCMedia Capture API で仕様が策定中です。Media Capture API はiOS6でその一部が実装され、遂にカメラが使えるようになりました(参考: iOS6のSafariでサポートされるHTML5の機能)。Androidでもversion 3から対応しています( Android 4の新機能でカメラWebアプリ作ってみた)。残念ながらPC向けブラウザは対応しているものはなさそうです。動画や音声のストリーミングが可能なWebRTCについては、Opera 12、AndroidOpera mobileが標準で対応、Google Chrome がオプションで対応しています。

Gyroscope(ジャイロスコープ)は DeviceOrientation Event Specificationで仕様策定されています。最新のiOS/Androidなら結構動きます。

BluetoothHTML5でデバイス機能を使うためのDevice API にも標準化されていません。今後の追加予定も無さそうです。(追記: あるよ、とご指摘いただきました。末尾で追加しました)プッシュ通知については、そのものではありませんが、Server-Sent Eventsというもので実現可能です。ブラウザでこれを受け取りOSの通知システムと連動すればネイティブアプリのようになるでしょう。

バイブレーションは Vibration APIで標準化されています。未だ Firefox Aurora でしかサポートされてませんが時間の問題でしょう。メディアファイルへのアクセスは前述の通り。バックグラウンドでの起動は Web Workers でできそうですが、現在のところ iOSなどではバックグラウンド中のJavaScriptは停止してしまうため無理そうです。今後の改善に期待!

HTML5で作るiPhoneアプリのできない5つのこと

続いての記事はこちら HTML5で作るiPhoneアプリのできない5つのこと。こちらも2年以上前なのでだいぶ変わりましたねー。ちなみに3が二つあるのは原文まま。

1、clipboardの利用
2、ファイルのアップロード
3、カメラ
3、シェイクイベント
4、加速度センサー
5、バックグラウンド起動

クリップボード欲しいですよねぇ。無いことが意外だとクライアントによく言われます。未だ実装はありませんが、仕様はあります。 Clipboard API and events です。最終更新が去年の2月ですね。なにやらパテントの関係で難航しているようです。。。

ファイルのアップロートは先のMedia Capture APIとFile APIによってiOS6から対応済みです。ただしアルバム内に限る。任意のファイルできません。カメラは前述の通り。シェイクイベントはDeviceOrientation Eventで実現可能です。加速度センサーも同様ですね。

Flashだとここまでできる! HTML5とFlashの機能比較

だいぶ疲れてきました。しかも時間無い。。最後はFlashとの比較。 Flashだとここまでできる! HTML5とFlashの機能比較

クロスブラウザの映像対応
依然として動画コーデックの統一が進んでおらずクロスブラウザに対応した動画コンテンツを提供することが難しい状況です。

これは前述の通り。モバイルはだいぶH.264に寄ってきましたが、デスクトップはまだまだ。

Flash だと縦書きができる

CSS3でwriting-modeがサポートされました。コレを使えば縦書きもできます。こちらの サンプルの右下 Vertical Textで確認できます。

Flash だとタイムラインアニメーションに映像を組み込める

HTML5のオーサリングツールも出始めました。

これらを使えばFlashのようにCanvasアニメーションを作ることが出来ます。

Flash の 3D は進化している

HTML5の3Dも進化しています。WebGLの性能もあがり、便利なライブラリも充実してきています。tree.jsのサンプルで体験することが出来ます。

Flash だとウェブカメラが利用できる

先のWebRTCを使えばHTML5でもウェブカメラが使えます。 WebRTCはブラウザ上でリアルタイムコミュニケーションをするためのフレームワーク。HTML5 Conference 2012
ChromeのCanaryビルドなどで使うことが出来ます。正式サポートまでもう少し!?

Flash 内部で音を生成して再生することができる

HTML5でもこんなドラムマシーンができます。 HTML5 AudioとJavaScriptで作った簡易ドラムマシン

まとめ

時間が無いので手短にまとめます。

  • ここ2年くらいでHTML5で出来ることが随分増えた。
  • 特にモバイルの進化がすごい。
  • これからの2年もきっとすごい進化する。

ということで、本来ならばまだできないことをまとめたいところですが、早くしないと今日が終わってしまうため今回はここまで!

と、してたのですが、やっぱり気持ち悪いので簡単にまとめを追加。
これまで上げた点から、今でもどのブラウザでも出来ない、2012年12月版HTML5で出来ないことは以下の5点!

  1. DRM
  2. Bluetooth通信
  3. OSへのプッシュ通知
  4. バックグラウンドでの起動
  5. クリップボード

個人的には 3,4,5あたりができるようになるともう最高なんだけどなー。これらはまだまだ先の話になりそうです。


追記:
ブクマやtwitterでコメントいただきました。ありがとうございます。
アレが入ってないぞ,このヤロー!とかあるとおもうので、ジャンジャン突っ込んで下さい!

ご指摘ありがとうございます。勉強になります。
System Applications Working Group というので、WebのNative化に対する標準化を進めているそうです。詳しくは小松さんの記事で!WebのNative化に対する標準化が始まる?

Web Applications Working Group では、アプリケーションとして必要な機能の標準化を進めています。クリップボードだけじゃなく、先に挙げたFullscreen APIやFile API、Server-Send Eventsなんかもこれに含まれています。他にも Database and Offline Application APIs、Web Intents、Web Sockets、Widgetsなんかもあります。


ブコメより

んー、出来ないことの範囲が狭い気がするよ、自由にローカルファイルを扱わせろとかOSコマンド実行させろとかあると思うんだけどなあ

確かに、File APIでローカルファイルが扱えるようになった、といっても <input type="file"> か、ドラッグ&ドロップしないとファイルハンドラを受け取れないのは不便ですよね。OSのファイルシステムにそのままアクセスはセキュリティ上問題でしょうけど、サンドボックスみたいな環境があっても良いかもですねー。同様に、OSのシステムコマンド実行も難しいでしょうねぇ。システムコールを呼べるようになると凄いんですが、セキュリティが心配すぎる。。


E4Xが使えない、なんて話しもどこかから。
E4Xありましたね。。。当時は画期的だ!と思ったのですが、JSONが普及してからはXMLがあんまり出番が無くなったような。FireFox もついに打ち切るそうです。E4X は衰退しました


他にもツッコミお待ちしてますー