第29回目の「HTML5とか勉強会」は、DeNAさんに会場をお借りして開催しました。
今回のテーマは「JavaScriptモバイルフレームワーク」 。最近色々なJavaScriptフレームワークが登場していますが、今回はその中からモバイルフレームワークについて講演していただきました。
本稿では、今回のイベントについてレポートします。
ngCoreについて
セッションの1つ目はngCore についてDeNA の紀平拓男さん に講演いただきました。
ngCoreはJavaScriptを使ったゲーム用のフレームワークで、ゲームとソーシャルの機能に特化したAPIが用意されていて、ngGoといったゲームライブラリやIDEのngBuilderがあるとのことです。ngCoreで書かれたソースはiOSとAndroidの2つのプラットフォームで動かすことが可能で、個人でも無料で試用することができると紹介しました。
他のゲームエンジンと比較したngCoreの特徴として、収益を上げる実績があること、開発支援環境が充実していること、SDKにソーシャル系のAPIが標準で用意されていること、開発言語がJavaScriptであるといった点があるとのことです。中でも開発言語がJavaScriptであることが重要で、ブラウザでそのまま実行できることが大きなメリットであり、iOSやAndroidで動いているゲームアプリをそのままブラウザで動かすことができると述べていました。
ゲームをHTML5化することのメリットとして、アップデートに審査が必要なプラットフォームと比べてリアルタイムでアップデートできること、HTML5が使える新しいプラットフォームへの対応が簡単なこと、リリースしたゲームがアプリとWebのどちらで流行っても即座に対応できるといったことがあるとのことです。
ネイティブアプリを作るフレームワークでも将来のHTML5移行を見据えることが重要で、JavaScriptではない言語を使ったフレームワークは今後HTML5に移行する際にスムーズに行かない可能性があることから、JavaScriptのフレームワークを優先的に使うことが推奨されると述べていました。
ngCoreの詳しい解説やデモなどは講演動画 をご覧ください。
PhoneGap
セッションの2つ目はPhoneGapについて、ネオローグのタチゾノマサヒコさん に講演いただきました。
はじめにWebアプリとネイティブアプリの比較を紹介しました。
Webアプリとネイティブアプリの差として開発言語の違い、既存プラットフォームで課金システムが使えるかどうか、マルチプラットフォーム対応、集客にかかる手間、そしてデバイス固有の機能が使えるかどうかの差があるとのことです。ネイティブアプリでないと色々と厳しい面もありますが、ネイティブアプリの開発は単一プラットフォームでも手間がかかり、マルチプラットフォーム化は大変だと述べていました。これらの差はハイブリッドアプリにすることで減らすことができるとのことです。
PhoneGapはWebViewをベースにしていて、各種プラットフォーム上で動くアプリとしてwrapします。JavaScriptからネイティブAPIへのブリッジを提供することで端末のカメラやセンサー、連絡帳など様々な固有機能を使うことができるとのことです。
PhoneGapはiOSやAndroidなど多くのプラットフォームに対応していますが、プラットフォームによってはサポートされていないAPIもあるとのことです。PhoneGapにはプラグインが存在しており、TwitterプラグインやFacebookプラグインなど便利な機能を追加することができるそうです。
PhoneGapにはPhoneGap Build というWebサービスがあり、HTML・CSS・JavaScriptをアップロードすることで各プラットフォーム向けのバイナリを書き出すことができるそうです。簡単にバイナリが作ることができるサービスとしては優秀で、iOSやAndroidだけでなくWindow PhoneやBlackBerryといったプラットフォームのバイナリも作ることができるとのことです。
詳しい内容は講演動画 と講演資料 をご覧ください。
Titanium Mobile
セッション3つめはAppcelaratorの増井雄一郎さん にTitanium Mobile について講演いただきました。
Titanium MobileはJavaScriptを利用してiOSやAndroid向けのネイティブアプリを作ることができるフレームワークです。Objective-CやJavaでの開発に比べて簡単にネイティブアプリが作成できます。Titanium Mobileは現在30万人の開発者によって35,000以上のアプリがマーケットに出されていて、中にはObjective-Cで書かれたコードを捨て、Titanium Mobileで作りなおしてiOSとAndroidの両方に対応させるといった事例もあると紹介しました。
Titanium Mobileを使ってリリースされたアプリの中には、デザイナーの方が作ったアプリもあるそうで、とても簡単にアプリの作成ができるとのことです。
Titanium Mobileで書かれたコードは各プラットフォームの特徴を考慮したインターフェースで実行されます。例えばAndroidではタブが上に表示されますが、iOSでは下に表示されるといったようにプラットフォーム毎にユーザの体験を邪魔しないUIを作りこむことができるとのことです。
他にも、DRMの処理などJavaScriptで実行させるには向かないものに関して、Titanium MobileではObjective-CやJavaによってModuleとして拡張できるとのことです。これら作成したModuleはOpen Mobile Marketplace で売買することができると紹介しました。
詳しい内容は講演動画 と講演資料 をご覧ください。
モバイルフレームワーク座談会
メインセッションの最後は講演者の方々による座談会が行われました。モデレータは小松健作さん に務めていただきました。座談会では各テーマについて色々な発言がありましたが、今回はその中からいくつかピックアップして紹介していきます。
テーマ「パフォーマンスの追求」
最初のテーマはJavaScriptのパフォーマンスです。
増井さんはブラウザのガベージコレクションについて言及しました。ガベージコレクションの問題として、メモリを使い過ぎるとメモリ回収のタイミングで画面が1秒間固まってしまうといったことが起きてしまうそうです。ゲームプログラミングでは技法としてそういったものを回避しているが、JavaScriptの場合でも書く必要があるケースが出てくるだろうと言います。
それにあわせて紀平さんは、iOSのJavaScriptエンジンでは問題ないが、V8ではあるタイミングで止まってしまうことがあるので、ngCoreではライブラリなどでガベージコレクションが起こらないようにするなどの回避方法を用意をしていると述べていました。
テーマ「Browser Segmentation」
ブラウザや端末の差異によって起こる問題をどう吸収するかを取り上げました。
端末の画面サイズなどは千差万別で色々ありますが、ngCoreでは一つのソースがすべての端末で動くことが求められるため、swith・caseで分けるなどエンジン側で吸収できるようにとにかく頑張っていると紀平さんは言います。またngCoreでは実際に動いてるアプリの中にアプリ名と離脱率を取る仕掛けを用意することで、特定の端末の離脱率が高かった場合に、それを調査して対応するといった取り組みをしてると述べていました。
テーマ「マルチデバイスへの対応 UI/UX」
テレビでWebを利用するなど新しいデバイスが続々と登場している中、これらのデバイスのUIやUXはどうなっていくかを取り上げました。
テレビの視野角とスマートフォンの視野角がほとんど一緒だから、もしかしたらスマートフォンのUIがそのまま使えるのではと紀平さんは言います。増井さんはテレビのブラウザは結構前からありますが、なかなか使われてないことからも、新しいUIの登場が待たれているのかなと述べていました。
タチゾノさんはテレビにTwitterなどのコメントを流す機能にふれ、インターネットからテレビにUXを持ってくる形で進化していくのではないかと言います。
テーマ「バイバイObjctive-C?」
開発発言についても話が及びました。増井さんはObjective-C自体が言語としてどんどん進化していると言います。
紀平さんは言語は目的にあった物を選ぶべきだが、ハードウェアに密接した物、Objective-CやJavaを知っていることは今後もプラスになっていくと話します。
タチゾノさんは開発効率にふれ、大切なのはライブラリでJavaScriptで苦労して実現したものがObjective-Cでポンとできちゃうといったこともあると述べていました。
座談会では他のテーマについての話や質疑応答もありました。詳しくは講演動画 をご覧ください。
懇親会セッション
ここからは懇親会中のセッションになります。
MobiRuby
1つ目はMobiRuby についてAppcelaratorの増井雄一郎さんに紹介いただきました。
MobiRubyはiOSアプリをRubyで開発することを可能にするもので、MobiRubyを使えばObjective-Cを使わないでiOSアプリが書けるとのことです。
AppcelaratorのTitanium Mobileと真っ向から対立するフレームワークを作っている増井さんですが、Appcelaratorの社長さんからは快く認められてもらっているとのことです。
Arctic.js
2つ目はArctic.jsについてDeNAの近澤さんに紹介いただきました。
Arctic.jsはスマートフォンブラウザ向けのゲームフレームワークで、iOSやAndroidの差異を吸収してくれると紹介しました。Arcitic.jsの名前は某ラーメン店のメニューから命名したとのことです。
Arctic.jsはMITライセンスで公開されており、GitHub からダウンロードすることができます。
HTML5 Quiz
懇親会の最後にはDeNAの武部さんによる企画、「 HTML5 Quiz」がありました。
全10問の選択式クイズで、勉強会参加者の方々や本勉強会のスタッフなど、HTML5に詳しい人にもやり応えがある問題が多かったです。上位の人には賞品が与えられるなど、参加者みんなが楽しめるクイズで大いに盛り上がりました。
最後に
レポートに対する感想や、勉強会に対する希望・意見・取り上げて欲しいテーマなどがありましたら、twitter(@nakajmg) まで気軽につぶやいていただければと思います。
本勉強会は、毎月第3水曜日、または第3木曜日に開催していますので、興味を持たれた方は是非参加ください。ただし、会場や講演者スケジュールの都合などにより、開催日程が前後することがあります。開催のアナウンスはhtml5j.orgのML で行われますので、こちらをご確認ください。また、コミュニティサイトhtml5j.org も公開していますので、是非こちらもご覧ください。