本連載ではアドビシステムズのWebアプリケーション開発ツール新バージョン「Adobe Flex 2.0」について紹介していきます。Flexは，従来のWebアプリケーションよりも操作性が優れたWebアプリケーション，いわゆる「RIA（Rich Internet Application）」を開発するためのツールです。
バージョン「2.0」が出荷されたということは，以前のバージョン（実際にはFlex 1.x）がこれまで出荷されていたということですが，Flex 2.0は全く新しい製品と言ってもよいくらい前バージョン（Flex 1.x）とは異なっています。連載の第1回である今回は，Flex 2.0の概要を紹介します。Flex 1.xは知っているけど敬遠していた，という人も，ぜひ，読んでみてください。
Flexって要するに何？
皆さんは，Flashムービー（Flashアプリケーション）を使ったWebページをご覧になったことがあるでしょう。Flashムービーと聞くと，アニメーションやゲームといったエンタテインメント系コンテンツを想像する方が多いと思います。しかし実は，Flashムービーは，Windowsアプリケーションのような操作性が高いUI（ユーザー・インタフェース）を備えたWebアプリケーションの開発にもよく利用されています。
Flashムービーを作るためのツールとして知られているのが，アドビシステムズの「Flash 8」です。しかしFlash 8は，業務系アプリケーションを開発している多くのエンジニアにとって，決して使いやすいツールとは言えません。例えば，「タイムライン」や「MovieClip（ムービークリップ）」といったFlashムービーを作るうえで重要な概念は，エンジニアにはなかなかなじみにくいのではないかと思います。
それを解決するために登場したのがFlexです。Flexはまさに，エンジニアがFlashムービーを使って操作性の高い業務系Webアプリケーションを開発するための製品です。細かいところを抜きにして端的に言ってしまえば，「Flexはエンジニア向けのFlash」なのです。
Flash 8での開発ではオーサリング作業がメインになります（図1）。一方Flexでは主に，XMLベースの言語である「MXML（Macromedia Flex Markup Language）」を使ってコーディングを行います（図2）。すなわち，「タイムライン」や「MovieClip」を意識することなく開発できます＊1。また，Flex 2.0の製品ファミリーにはエンタプライズ向けのサーバーサイド製品が用意されているのも大きな特徴です。
|
|
| 図1●Flash 8の開発環境。アプリケーション開発では，タイムライン上のフレームに1コマずつ絵を描いていくイメージになる |
|
|
| 図2●Flex 2.0が備える開発ツールFlex Builder2。独自言語の「MXML」でアプリケーションを開発する作法は，プログラマにもなじみやすい |
もちろん，どちらのツールも，ロジックを記述するために，スクリプト言語「ActionScript」を使用したり，開発したアプリケーションをコンパイルするとFlash Player上で動作するSWF形式のファイルになる，といった点は共通しています。FlexとFlashの機能比較を表1にまとめましたので，参考にしてください。また，Flexの前バージョンであるFlex 1.5との違いについては，カコミ記事「Flex 1.xとFlex 2.0で何が変わった？」をご覧ください。
|
|
| 表1●FlexとFlashの機能比較（クリックすると拡大表示します） |
Flex 2.0は複数の製品で構成する
Flex 1.xは単一のサーバーサイド製品でした。Flex 2.0では必要に応じて，製品ファミリーの中から必要なものを選択してシステムを構築できるようになりました。システム構成例は後ほど紹介するとして，まず製品ファミリーのそれぞれを簡単に紹介しましょう＊2。
●Flash Player 9
製品ファミリーとは若干違うかもしれませんが，Flex 2.0で作成されたSWFファイルを実行するには「Flash Player 9」が必要です。これはFlex 2.0が備えるActionScript（以下，AS）がバージョン3になったからです。従来のバージョンであるAS1とAS2は，AVM1（ActionScript Virtual Machine 1）上で動作しますが，AS3はAVM2上で動作します。
Flash Player 9にはAVM1とAVM2の両方が含まれています。旧バージョンのFlashムービーもFlex 2.0で作成したSWFも表示できるだけでなく，Flex 2.0で作成したアプリ上に旧バージョンのFlashムービーをロードすることも可能です。
AS2とAS3は大きく違います。AS2はAS1を拡張した，どちらかと言えば中途半端という印象を受ける言語でした。しかし，ゼロから開発されたAS3は，大幅に洗練されたオブジェクト指向言語になりました。コーディング次第では従来のASに比べて10倍速いコードを書ける，と言われています。
●Flex SDK 2
SDK（ソフトウエア開発キット）とフレームワークのFlex Framework 2で構成されており，アドビシステムズのWebサイトから無償で入手できます。SDKには，ActionScriptやMXMLのコマンドライン・コンパイラとコマンドライン・デバッガが含まれます。テキスト・エディタ（Windowsのメモ帳など）でコーディングし，このSDKでコンパイルするようにすれば，追加投資なしでFlexのアプリケーションを開発できます。
Flex Framework 2 はFlex 2.0用のコンポーネントを利用したフレームワークです。一部のコンポーネントを除いて，ソースコードが付属します。旧バージョンのFlex 1.xのコンポーネントは非常に重かったのですが，Flex 2.0では軽量化されクライアントサイドでのパフォーマンスも向上しました。
●Flex Charting 2
Flex SDK 2 には，チャートやグラフを描画するためのコンポーネントは含まれていません。業務系アプリケーションなどでチャートを利用したい場合は，このコンポーネントを購入する必要があります（コンポーネントのソースコードは付随しません）。
●Flex Builder 2
プログラマにおなじみのオープンソース・ソフト「Eclipse」をベースにした開発統合環境です。コード補完やデバッガなどの機能を利用できます。Flex Builder 2はスタンドアロン版とEclipseプラグイン版が用意されています。Eclipseをすでに使っている方はプラグイン版を選択するのが良いでしょう。Eclipseを使用していない方には，スタンドアロン版をお勧めします。プラグイン版を使うためにはEclipseを入手してインストールしなければなりませんし，日本語化するためにはさらにパッチを適用する必要があるからです。
なおプラグイン版は，原稿執筆時点（2006年9月）では，Eclipseの最新バージョンであるEclipse 3.2には対応していません。また，Windows版しかリリースされていません＊3。また，Flex Builder 2には，前述のチャート・コンポーネント（Flex Charting 2）は付属しません。チャート・コンポーネントが必要な場合は，チャート・コンポーネントを追加購入するか，バンドルしたFlex Builder 2 with Chartingを購入する必要があります。価格は，スタンドアロン版，プラグイン版いずれも，6万4900円です。チャート・コンポーネントがバンドルするバージョンは9万7900円になります。
●Flex Data Services 2
Flex 1.xの後継にあたるサーバーサイド製品です。サーバーサイド・ソフトやデータベースとの連携のほか，サーバーサイドにおけるプログラムの動的なコンパイルや，データのプッシュ配信などを可能にします。接続数無制限のEnterprise版が260万円（1CPUあたり），などです＊4。
Flexで開発したアプリはサーバーと非同期で通信する
Flex 2.0 で開発したFlashムービー（SWFファイル）とサーバーサイドとのやり取りには，通常の「HTTPリクエスト→HTTPレスポンス」を利用します。もちろん，Webサービスも利用可能です。FlashムービーのActionScriptではリクエストした関数でレスポンスを待つことはありません。レスポンスは非同期イベントとして発生します＊5。
図3をご覧ください。まず，Flexアプリからサーバーにリクエストを投げます（図3(a)）。その後，サーバーからのレスポンスを待つことなく，ユーザーが画面を操作できる状態になります（図3(b)）。通常のWebアプリのようにレスポンスが返ってくるまで待つ必要はありません。サーバー側の処理が完了するとFlexアプリにレスポンス・イベントが発生しますから＊6，それに対応する処理を実施します（図3(c)）。
|
|
| 図3●Flexで開発したアプリケーションとサーバー間のやり取りの例 |
小規模なシステムから大規模なシステムまで
Flexアプリの最も単純な構成例を図4に挙げます。サーバーサイドは .NETやPHPやJavaで開発します。Flexで開発したコンパイル済みSWFファイルをWebサーバーにアップロードしておきます。ユーザーはブラウザにダウンロードされたSWFファイルを操作する仕組みです。
|
|
| 図4●Flexアプリのシステム構成例(1）。最も単純な構成 |
この場合，Flex Data Services 2（以下，FDS2）を購入する必要はありません。例えば，LAMP構成＊7なら，サーバー本体の費用＋インストール作業費＋開発費のみでシステムを構築することが可能です。
次に，FDS2を含めたシステム構成を紹介します。執筆時点ではFDS2と連携できるサーバーサイド・プログラムは，Javaアプリケーションと，アプリケーション・サーバーのColdFusionです。図5では，サーバーサイドでのコンパイル機能は利用せず，プッシュ配信などの他の機能だけを利用しています＊8。
|
|
| 図5●システム構成例(2)。Flex Data Services 2の機能を使う |
図6は，FDS2を最大限に活用する構成です。すっきりしていて，非常に設計しやすい構成だと思います。ただ，ボトルネックが発生するとそのままシステム障害につながる可能性が大きいので，負荷分散や冗長化対策が必須です。予算もそれなりに必要になります。
|
|
| 図6●システム構成例(3)。Flex Data Services 2をフルに活用している |
図5と図6には，オープンソース・ソフト「Seasar2」が含まれています。実は，Seasar2の「S2Flex2」モジュールを使えば，FDS2を利用しなくても，Seasar2に登録したJavaコンポーネントをFlex2（SWFファイル）から呼び出せるようになるのです。S2Flex2はAMF（Action Message Format）プロトコルの最新バージョンであるAMF3を，世界で初めて実装したオープンソース・ソフトです。詳細はこちらをご覧ください。
すべての構成で使われているアプリケーション・サーバー「ColdFusion」はアドビシステムズの製品だけあって，Flex2と非常に相性が良いのが特徴です。サーバーサイドのコンポーネントを呼び出す「RemoteObject」クラスはFDS2でしか使えないとFlex2のヘルプには記載されていますが，実はColdFusion MX 7.0.2でも利用できます。ColdFusionはもともとJavaベースなので，Javaアプリケーションとの相性も優れています。
ColdFusionは日本でこそマイナーな印象がありますが，世界的に有名なアプリケーション・サーバーで，北米では州ごとにユーザー・グループがあるほどです。ColdFusionとFlex2についてはこちらを参照してください。
以上，連載の初回である今回はFlex 2.0の概要を簡単に紹介しました。次回からはFlex2.0の技術的な内容について，突っ込んで紹介をしていきます。
次回へ
|
