マトリックス風「トロン」をリアルタイムで実現するHTML5デモのスゴイところ【@maskin】

[読了時間:2分]

　トップページで強制的にFlashムービーを再生させる最低の手法を筆頭にFlashコンテンツがどんどん減り、HTML5を中心とした技術に取って代わりつつある。現状では「FlashのほうがCPU能力を消費しにくい」というレポートがあるなど全面的に優位性があるわけではないが、このデモのようにマシンパワーを浪費しつつも、今まではできないとされていた表現の壁を崩しつつある。

　冒頭のスナップショットは、最近リメイクされた映画「トロン レガシー」の旧作版「トロン」（1982年製作）の映像をリアルタイム画像処理にかけているところ。大層なサーバー群で演算→ストリーミングで配信しているのではなく、再生している端末上でHTML5ビデオを変換してCANVAS要素に表示させている。

　このHTML5ビデオは1秒あたり30フレームを表現しており、筆者のMac Book (Core2Duo 2GHz、4GBメモリー）ではマトリックス風視覚効果をかけてもスムーズに再生されるものの、CPUの消費率は100％と全開だった。この点は、デモページにも注記されている。

　しかしながら、このようなシステムをフロントエンド側（サーバー側をバックエンドととらえたHTMLコーディング側）だけで実現してしまうとなると、クリエイティブの現場のみならず、最近シンクライアント的なスペックが多い消費者向けパソコンの世界にも大きな影響を及ぼすのは必至と言えるだろう。

■ 関連URL
・Real-time video processing with html5 video + canvas + javascript + css.
http://www.barbafan.de/html5video?video=tron

蛇足：僕はこう思ったッス

デモサイトのソースを見てもらえればわかる通り、変換制御はJavaScriptだけで行っている。サーバーサイドであれこれやってないということにプチ感動。ハードディスク上のデータをクラウド（サーバー）に置く流れがある一方、アプリケーションや各機能をHTML5によってクライアント（端末）側に構築する流れが生まれている模様。このように或る種の統一的な流れが生まれると、パソコンを筆頭としたネット端末向けのアプリマーケットの勢力が拡大するように思える。「データ」「コンテンツ」「アプリ」が分離しつつ融合するマーケット。これは20年くらい前に多くの人が夢見た「ハイパーコンテンツ」的構図のように思える。すでにiPhoneで実施しているAppleのみならずAndroid、Mozillaなども参入してくるだろうが、ここに日本発の流れが出てきてもいいと思う。