レポート

「第30回 HTML5とか勉強会 ~モバイルUIフレームワーク」活動報告

この記事を読むのに必要な時間:およそ 3 分

6月12日,第30回を迎えた「HTML5とか勉強会」は,Googleのオフィスをお借りして開催しました。今回は前回のテーマであったフレームワーク特集の続編として,モバイルUIフレームワークにフォーカスを当てたセッションが行われました。

本稿では,今回のイベントについてレポートします。

画像

レポートに入る前に,開催30回という節目を迎えた本勉強会のこれまでを簡単に振り返ってみます。

これまでのスピーカーや参加者の人数、会場は次のとおりです。

多くの人と企業の協力のもとに開催してきました本勉強会ですが,30回という節目を記念して国内外の方々からたくさんのメッセージをいただきました。これらのメッセージは後日,html5j.orgで公開予定ですので,ぜひご覧ください。

編注
gihyo.jpでは,本勉強会の第7回より,スタッフの方にレポートをご寄稿いただいております。こちらのページで一覧できます。

jQuery Mobile

ここからメインセッションの紹介です。

はじめに,CAモバイルの吉川さんより,jQuery Mobileの良い所や悪いところ,ツールやプラグインについて紹介していただきました。

画像

jQuery Mobileはモバイル向けのJavaScriptフレームワークです。jQueryを普段利用している人にとってはとても簡単にモバイル向けのサイトを作ることができます。

jQuery Mobileは基本的な設計のほとんどをマークアップで作ることができるので,デザイナーさんでもデベロッパーさんでも簡単にモバイルサイトを作ることができます。jQuery モバイルの大きな売りはプログラムが苦手な人,デザインが苦手な人が簡単にモバイルサイトを作れることだそうです。

jQuery Mobileのメリット・デメリットとして次の点を挙げていました。

メリット
  • とても簡単にモバイルサイトが作れる
  • クロスブラウザに対応できる
  • 開発が活発で情報が多い
デメリット
  • フレームワークが大きく,ルール付けや縛りが多い
  • ある程度のデザインが決まっているためカスタマイズが難しい
  • DOM操作が多いため,デバイスによっては動作が遅い

このメリットとデメリットを考慮したjQuery Mobileの使いどころとして,モックやプロトタイプ,業務アプリなどスピードが求められる場面には最適であるとのことです。また,デザインをこだわる場合や,ハイパフォーマンスを求める場合にはそれなりのコストがかかると述べていました。

jQuery Mobileはページ遷移にajaxを利用しているため,同一ドメイン上に信頼できないリソースがある場合はセキュリティに注意する必要があるとのことです。詳しくは吉川さんのブログ記事をご覧ください。

講演では他にもjQuery Mobileを使った様々なデザインが見れるギャラリーや,ツールの紹介がありました。詳しくは講演動画講演資料をご覧ください。

Sencha Touch 2

つぎに,Ext Japan, LLC直鳥さんSencha Touchの特徴や,開発ツールについて紹介いただきました。

画像

Sencha TouchはWebkit向けのHTML5フレームワークで,ネイティブアプリの見た目と操作性をWebアプリで実現することができます。ライセンスは無償の商用ライセンスとGPLライセンスが用意されているとのことです。

今年新たにExt JS 4をベースとしたSencha Touch 2がリリースされました。Sencha Touch 2ではパフォーマンスの改善,開発環境Sencha Architect 2によるサポート,ネイティブへのパッケージングなどがあると紹介しました。

Sencha TouchはJavaScriptにコンフィグを書き込んでいくことでUIを構築していきます。そのためjQuery Mobileと比べた場合,デザイナーさんには扱う敷居が高くなっているかもしれないと述べていました。

Sencha Touchには次のような開発を支援するツールがあると紹介しました。

Sencha Architect 2
  • Sencha Touch 2とExt JS 4用の開発環境
  • 有償(30日間の使用期間)
  • Mac/Windows/Linuxで動作する
Sencha SDK Tools
  • コマンドラインツール
  • MVCプロジェクトの自動作成
  • プロジェクトのBulid
  • ネイティプパッケージング
  • Microloader(Webアプリのローディングを早くする仕組み)

Sencha Touchはゲームなどには向いていないが,業務向けアプリとして使われてきたという流れがあります。MVCという使い慣れたアーキテクチャを取り入れて,チーム開発により適した方向へとSencha Touchは進化していると述べていました。

講演動画講演資料も合わせてご覧ください。講演中のデモで使われたソースコードがこちらで公開されていますのでお試しください。(要Sencha Architect)

著者プロフィール

中島直博(なかじまなおひろ)

DMM.com Labo所属。

html5j/HTML5とか勉強会スタッフ。

フロントエンドエンジニアとして主にスマートフォン向けサービスの開発に従事。ツチノコの巣に迷い込んだひよっこ。

twitter:@nakajmg

コメント

コメントの記入