最新トレンドやキーワードをわかりやすく解説
WCR Watch [1]
リッチクライアントの最右翼FlexとFlashの違い
宮下知起
2004/11/9
10月23日(2004年)、マクロメディアがユーザー向けに開催したカンファレンス「Macromedia Flash Conference 2004」では、マクロメディアがRIA(Rich Internet Application)の普及に向けて、RIAのプラットフォームと開発ツールの提供に注力することがあらためて強調された。そして、RIAを推進する原動力が従来のFlashではなく、“Macromedia Flex”であることが明言された機会でもあった。本稿では、まだ内容が広く知られていないMacromedia FlexでRIAを実現する場合と従来のFlash作成ツール“Flash MX”を使う場合とでどのような違いがあるのか、カンファレンスの各スピーカーの発言内容から整理してみたい。
米マクロメディア シニアプロダクトエバンジェリスト Christophe Coenraets氏 |
ところで、“RIA”と“リッチクライアント”という2つのキーワードの存在に読者は混乱するかもしれない。今回のカンファレンスでマクロメディアは、「RIAは、リッチなユーザーインターフェイスを保ちながら、誰もが使うことができる、リーチの長いWebアプリケーションのデプロイモデル」(米マクロメディア
シニアプロダクトエバンジェリスト Christophe Coenraets氏)という定義を加えている。Flashの普及率は現在インターネットに接続するPCの98%だ。しかもFlashにはCurlやBiz/Browserが必要とするクライアントライセンスが不要。マクロメディアのリッチクライアント・ソリューションは、Flashをユーザーインターフェイスに用いることでより幅広いユーザーに利用できる、ということを同社は訴えている。
編注:Macromedia Flexの詳細は「XMLでリッチクライアントを実現「Macromedia
Flex」」を参照してほしい。
さらに同氏は「Flexのプログラミングモデルは、JavaのJSPによく似たプログラミングモデルを持つ。タグベースの開発スタイルを持つため、J2EE開発者には馴染み易いはずだ」と説明する。Flexでは、画面の設計をMXMLと呼ばれるテキストベースのタグで行う。テキストファイルなので、開発者は任意のテキストエディタで開発ができる。MXMLはXML形式のマークアップ言語なので、普段XMLを書く機会の多い開発者には難しくないはずだ。
Flexには、Flashで実現するグリッドやアコーディオンタブなど、さまざまなユーザーインターフェイスがコンポーネントで用意されている。XMLのタグでこれらを利用することを定義するだけで、実行時にFlashによるユーザーインターフェイスが生成される。
また、FlexにはFlex Builderと呼ばれる開発環境が提供される。これは、Macromedia Dreamweaver MXの環境をベースに開発されたもので、DreameweaverがWYSIWYGでHTMLをコーディングできるのと同様に、ユーザーインターフェイスと、その対になるMXMLの両方を随時参照しながら開発できる。
さらにFlexでは、ユーザーインターフェイスにひも付くさまざまなアクションはAction Script 2(以下Action Script)で記述することになるが、Action Scriptは完全なオブジェクト指向言語であり、Javaプログラマには取っ付きやすい。
株式会社セカンドファクトリー コミュニケーションセクションマネージャ/RIA アーキテクト 東賢氏 |
株式会社セカンドファクトリー コミュニケーションセクションマネージャ/RIA アーキテクト 東賢氏は、従来までデザイナがFlashムービーに動きを持たせるためだったAction
ScriptがAction Script2になったことで、システム開発向けに変化したと述べる。「もともとアニメーションのための言語だったので、以前はバグに甘いところがあった。なぜなら内部的にエラーがあっても、アニメーションは動いていた方がよかったからだ。Action
Script 2は型チェックが厳密になったことによって、バグが潜みづらくなった」と説明する。また、Javaと同様にインターフェイスの継承が可能になったことでプログラムのメンテナンス性も高まっている。さらに東氏は「Flexでの開発にはオブジェクト指向の思考ができる人が重要だ。そこから考えると、Javaプログラマからの転向の方が現実的だ。中途半端に以前のAction
Scriptに詳しい人はかえって開発の障害になる可能性もある」と述べる。
■Flexの優位性はどこにあるのか?
従来のFlashは、オーサリングツールを使ってバイナリファイルであるFlashファイル(swfファイル)を作成してサーバに配置したが、Flexの場合は異なる。サーバにはMXMLで記述したテキストファイルを配置する。JSPが実行時サーブレットにコンパイルされるのと同様、MXMLは実行時にコンパイルされ、swfファイルが生成される。2回目以降のアクセスではキャッシュされたswfファイルが使われる。これはJSPのコンパイルモデルに似ている。
JSPと同様のコンパイルモデルは「JSPにデータベースアクセスに必要な情報を埋め込むことができ、swfファイルのサイズを小さくすることができる」(東氏)メリットももたらす。また画像もswfファイルに含めなくてもよくなるので、この点でもswfファイルのサイズ縮小に貢献する。Flexによる開発は通常のJSP、HTMLを使ったWebアプリケーション開発の手法を適用しやすい。
セカンドファクトリーは、最近自社が手掛けた「富士写真フイルムのサービス」を例に、Flexのメリットを説明する。「お客さまは開発後のメンテナンスを自社でやりたいと考えていた。Flexであれば、FlashのユーザーインターフェイスをJSPと同様にテキストファイルで管理できる。また、頻繁な仕様変更が予測されるので、修正作業そのものがトラブルのトリガとなることが予想された。そのため、テキストファイルであることが求められた」
さらに、このシステムは他社にASPサービスとして提供することも想定されていたため、画面のコーポレートカラーや見栄えを切り替えられる必要があった。「通常のFlashでは、画像をスタティックにswfファイルに埋め込むことしかできなかった。しかし、Flexの場合は、画像の要素を外部のリソースから持ってくることができるために、機能は同じで見栄えだけを変えることが容易だ」(東氏)。
■FlexはRIAの開発効率を向上させる
RIAの開発では、生産性が大きな課題となる。高いユーザビリティを実現するために、その分開発にはコストが掛かるからだ。そのため、Flashによるユーザーインターフェイス構築においては、「提供されるコンポーネントがどれだけ充実しているか、また、そのまま使えるものがどれくらいあるかが重要なポイント」(東氏)だという。この点でセカンドファクトリーはFlexを高く評価する。またFlexではアプリケーションの機能は変えずに、見栄えだけを変更する“スキニング”が容易になる。
さらにRIAの開発では、顧客が望む高いユーザビリティを実現するために、最初にユーザーインターフェイスのモックアップを作成し、それをクライアントに確認しながらいく度か修正を繰り返していくプロセスが必要になる。Flex Builderは、XMLファイルを変更するだけでユーザーインターフェイスを変更できるため、モックアップの作成には最適だ。「プロトタイプを最終的な仕様につなぐことができる」(東氏)という。
FlexによるRIAの開発では、デザイナが不要になるわけではない。もちろん、ユーザーに優れた体験、優れた操作性を提供するデザインを考えるのはデザイナの仕事である。Flexは、デザイナと開発者との間に明確な分業体制を提供する。クリエイティブの要素をアプリケーションロジックとは別にすることができる。
ただ、今後の課題は残される。RIAの開発にはテスト手法が確立されていない。「自由度が高い分、その確立には時間がかかる」(東氏)という。しかし、J2EE開発と似たモデルを適用できる点、「従来のJ2EE開発のノウハウを適用しやすい。これは大きなメリットだ」(東氏)とも述べた。
Flexは、従来までデザイナーの独壇場だったFlash開発を、J2EE開発者にも門戸を開いたプラットフォームだ。その実力は国内でもすでに評価できる段階に来た。正式出荷は11月中(2004年)に行われるが、Flex
1.5英語版(トライアル)とFlex Builder英語版(トライアル)はすでにマクロメディアのサイトからダウンロードできる。ぜひ、読者自らの手で評価してほしい。
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 (2017/7/12)
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET/POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 (2017/7/10)
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文&ループ脱出のbreak/スキップのcontinue【更新】 (2017/6/26)
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート (2017/6/12)
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
|
|