HTML5でスマホアプリ開発、ホントのところ

　ディー・エヌ・エー CTO室 紀平拓男氏の講演「スマートフォンにおけるHTML5実装の最先端」では、スマートデバイスにおけるHTML5関連技術の状況が紹介された。スマートデバイスにおけるHTML5関連技術はネイティブアプリに匹敵する状況まで習熟してきているという。

　まず紀平氏は、HTML5のCanvas要素に言及。JavaScriptのAPI経由で任意のドット描画が可能になったことに触れ、Flashで開発されたゲームとCanvas要素を活用して開発されたゲームのデモを示し、遜色ないレベルに到達していることが紹介された。デモを見る限り、違いを見つける方が困難だったといえる。

　また、 ApplicationCacheやlocalStorageなどの機能を取り上げ、アプリ開発に重要となる機能が用意されている点も紹介された。

　かといって、HTML5がパーフェクトな代替技術かといえば現状はそうでもなく、いくつかの弱点があることも指摘。特に「3D、音楽、速度といった内容で弱い面がある」と紀平氏。

　まず3Dについて、スマートデバイスではOpenGLが利用できないという。OpenGLをHTML5で活用するためのWebGLはFirefox for mobileのみがサポートしており、広く利用できる状況にはない。

　音楽はタイミング調整が極めてシビアであるうえに、同時に音が鳴らせないなどなにかと制限がきつい状況にある。

　また、そもそも描画速度が遅かったり、JavaScriptの実行そのものが遅かったり、ネイティブアプリにはかなわない面があるという。

　紀平氏からは実際の開発経験から、開発のポイントなども紹介された。CanvasレンダリングはiPhone／iOS 4の方がAndroidよりも遅いため、iPhone／iOS 4で快適に動作するように開発するようにしているという。

　特に、iOS 4はdrawImageが遅く、キャッシュを活用するなどして、いかにdrawImageの回数を減らすかが重要になるというアドバイスもあった。なおiOS 5では、この問題は解決しているという。

　また、処理の関係から「Canvasの上にさらにDOM要素を載せるといったことはしない方が良い」（紀平氏）といったアドバイスもあった。

　CSS3は基本的にGPUサポートで実行されるため、サクサク動作するが、同時に動作する物体が増えると急激に重くなること、AndroidではWebブラウザやデバイスごとに互換性問題が出ること、アニメーションなどに問題があるという点についても言及があった。1枚もののアニメーションで同時に動くものが少ない場合には、CSS3が活用できるが、それ以外のケースではCanvasの方が効果的という説明もあった。

　紀平氏からはJavaScriptの速度に関する開発経験も発表が行われた。evalやクロージャを頻繁に生成している場合には、JITが逆に動作を重くすることがあるが、この問題はツールレベルで検出しやすいため対処が容易だという。

　どちらかというと、JavaScript最大の遅さ原因はGC（ガベージコレクション）にあると指摘されていた。GC対策に万能薬は存在せず、よく知られた手法を確実に適用していくことで改善できるという。

　また、発展形として、把握しにくい実機におけるメモリ使用量の確認方法なども紹介があった。開発経験上、1回のJavaScript処理におけるメモリ使用量は100Mbytes以内になるようにすると問題が発生しにくいという