VB研公開ゼミ:テクノロジーバトル 開発者の選択

第1回 Silverlight vs. jQuery+ASP.NET AJAX

デジタルアドバンテージ 一色 政彦
2009/07/01
Page1 Page2 Page3 Page4

Silverlight、AjaxのリッチなUI部品

―― リッチなUIに関してはSilverlightが優位な印象を持っていますが、その点、Ajax派はどう考えているのでしょうか?

]一色 オープンソースのjQueryの場合、世界中のWebデザイナーや開発者がさまざまなUI部品(コントロールなど)を作っているので、数(2800以上)も種類も豊富です。それに対してSilverlightの場合、もちろんマイクロソフト純正品やサードパーティ製品が提供されていますが、jQueryのようにオープンソース・コミュニティの開発パワーは利用できません。この点ではAjaxの方が有利でしょう。

]八巻 やはり業務に使うとなると、オープンソースによるUI部品はサポートや保証がないという問題があります。その点、マイクロソフト製やサードパーティ製は安心感が違います。

]Silverlight派
株式会社デジタルアドバンテージ
Insider.NET編集部
編集長

遠藤 孝信

]遠藤 Ajaxの方は1つの機能として出来上がったUI部品が多いという印象がありますが、Silverlightの方は細かい基礎部品が多いです。Silverlightでは、この基礎部品を組み合わせて、自由にUIデザインが行えます。jQueryだと、既製品は簡単に使えますが、サイトに合うようにカスタマイズしようとすると苦労するのではありませんか?

]宮崎 JavaScript言語特有の書き方をしていますので、UI部品のコードを読もうとすると、難しくはありますが、開発者としてはそれは楽しくもあるのです(会場:笑)。JavaScript好きな開発者は特に「これだけシンプルなコードでこれだけの機能が実現できる」というのを楽しみにしている人が実際に多いです。

Silverlight、Ajaxの開発言語

]遠藤 個人的にJavaScriptがあまり好きではありません。もっと嫌いなのはブラウザに依存するHTMLやCSSです。そういう観点では、C#やVBが引き続き使えるSilverlightの方が良いです。ただしXAMLという新しい言語は勉強する必要があります。

 Webページ全体をSilverlightコントロールにすれば、完全にC#/VBとXAMLだけを使って開発できます。そうすればHTMLやCSSを扱う必要がありません。開発者としては、C#のような1つのプログラミング言語を中心に使えるのはメリットがあると思います。

]宮崎 これからはWeb上にあるサービスを利用する時代になってくると思います。これらのサービスがWebの世界で標準的に使われているJSON(=JavaScriptで簡単に扱えるデータ形式)でデータを提供することは大いに考えられます。そういうケースではJavaScriptの方が有利です。またJavaScriptであれば、サーバサイドの開発言語を問わず、C#/VBでも、Javaでも、PHPでもよいので、開発言語の選択肢の豊富さでは優勢です。

]菅原 仮にまったく開発経験がない人にリッチなWebアプリを作る方法を教えようとした場合、Ajaxだと覚えることがいっぱいあると思います。具体的には、HTML、CSS、JavaScriptなどの言語を教えて、Webアプリの仕組みも教える必要があります。それに比べると、Silverlightの方が、習得が早い気がします。

Silverlight、AjaxのUIのリッチさ

]一色 話を「リッチさ」に戻します。パネラーの皆さんは、どちらかというとプログラマー的な視点で考えていますね。しかしわたしの観点では、Webページのすべての要素がそろって初めてそのページは完成すると考えています。そういう点では、Webデザイナーによって利用者に使いやすいように考え抜かれたページこそが、ユーザビリティの高い、本当の意味で「リッチ」なページだと考えます。Ajaxであれば、そのリッチさを殺さないページ作成が可能です。例えばAjaxのjQueryであれば、デザイン自体はWebデザイナーが設計したままで、一部の情報を更新したりできます。その方が、Silverlightで作り込んだサイトよりも断然にリッチだと思います。

 Silverlightで同様のユーザビリティを確保するのは難しいです。Silverlightは確かにリッチに見えるけれど、リッチさを殺さないページを作成するには、単にコントロールをドラッグ&ドロップするだけではダメで、結局、細かなデザインのカスタマイズが必要になります。この作業が画像とHTML/CSSで作っているサイトに比べると大変だという感想を持っています。

 例えばVB6アプリケーションでも、標準コントロールだけを使うのではなく、その入力にふさわしいコントロールを自由に作れるなら、もっとユーザビリティの高いアプリを開発できると思います。Ajaxであれば、その場に適した入力欄など、ユーザビリティを追求したUIを、画像とCSSで自由かつ容易に作成できます。そういうのが「本当のリッチさ」だと思います。

]八巻 おっしゃることは否定しません。ですが、作りたいのはWebコンテンツではなく、「Webアプリ」です。そもそもHTMLは、その成り立ちがWebアプリのためのプラットフォームではなく、ドキュメントを記述するための言語です。いまのHTMLは、JavaScriptなど、さまざまなテクノロジを駆使することで無理やりアプリ・プラットフォームに仕立て上げて使っているわけです。Silverlightは初めからWeb上のアプリ・プラットフォームとして設計されているので、いろんなことがスマートに実現しやすくなっています。

―― 要するに、HTMLによるWebアプリはすでに一般化しており、ユーザーからみても身近な存在ですから、そういうものをリッチに発展・改良するにはAjaxの利用が理想的だけれども、ゼロから全然違う次世代Webアプリを構築するのならSilverlightの方がいいのでしょうね。

部分的なSilverlightの利用

―― ページの一部分でSilverlightコントロールを利用する方法もありますが、あれはあまり良くないのでしょうか?

]八巻 一般向けに公開するサイトであれば、そういう使い方も良いと思います。逆に、そのようなサイトで、Webサイト全体、全領域からHTMLコンテンツをなくしてSilverlight化してしまうと、[戻る]ボタンが使えなくなるなど、一般ユーザーが普段使っているWebサイトとかけ離れた仕様になりがちです。Webサイトの一部で例えばグラフなど視覚的に訴える要素が必要な場合には、(Ajaxを駆使して作るよりも)Silverlightで簡単に作るという使い方をお勧めします。一方で、イントラ内で利用する業務Webアプリケーションであれば、ページ全体にSilverlightコントロールを使ってもよいと思います。

]一色 部分的にSilverlightを使うということに対して懸念事項があります。というのも、6〜7年前はページの一部、例えばタブ切り替えやメニューの選択をFlashで作るケースが多かったと記憶していますが、最近の傾向として、それらはどんどんJavaScriptやAjaxに置き換えられていますよね。これと同じような用途でSilverlightを使う必要性はあまりないのではないでしょうか。

]八巻 確かにタブ切り替えにわざわざFlashやSilverlightを使う必要はないかもしれません。しかし、先ほど示したグラフなどの視覚的表示や広告などは、依然としてFlash/Silverlightが使われています。

Silverlight、AjaxのUIの開発環境/デザイナーとの分業

―― 開発環境はどちらが優れていますか?

]宮崎 Ajaxを活用したWebアプリの開発では、Expression Webというツールで効率的にWebをデザインして、それとVisual Studioを連携させてプログラミングやデバッグを行います。Silverlight開発ではExpression BlendでUIデザインして、それとVisual Studioを連携させます。つまり、同じような開発環境で開発できます。

]菅原 Silverlight開発においてデザイナーと分業をするという点では、正直、課題があるという印象を持っています。実際に「デザイナーがExpression Blendを使い、開発者がVisual Studioを使う」という分業を実際に行った例はほとんどないと思います。Expression Blendを使いこなせるデザイナーが増えれば状況は変わるかもしれませんが、いまのところそのようなデザイナーは皆無です。

]八巻 「デザイナー」とひと言でいってもいろんな方がいらっしゃいます。Webサイトは一般化しているので、HTMLやCSSを理解したWebデザイナーはいっぱいいますが、Silverlightの場合はXAMLを覚えなくてはならないのでデザイナーがなかなか増えません。理想的には3人体制で、グラフィックやイラストなどの画像素材を作る絵描きのデザイナー、プログラムを書くデベロッパー、そこにデザインとプログラムを統合するインテグレーターが必要です。そのインテグレーターが、XAMLを理解して、Expression Blendを使いこなせなければなりません。

]宮崎 Ajaxの場合は、WebデザイナーがHTMLとCSSでページをデザインして、開発者がJavaScriptを含めてプログラミングを行うという2人体制が、比較的実現しやすいです。

]Ajax派
山田 祥寛

]山田 ただし、Ajaxで動的な部分をDOMでゴリゴリと書いてしまうと、Webデザイナーとの分業がしにくくなるという問題もあります。しかし、次のASP.NET AJAX 4.0にHTMLテンプレートという機能が搭載される予定になっており、これによりJavaScriptとUIデザインを分離できるので、今後はより分業しやすくなっていくと思います。

会場 Silverlightではインタラクティブな部分のデザイナーが必要という話ですが、AjaxであってもやはりWebデザイナーと開発者をつなぐ作業は難しいので、同様のデザイナーが必要ではないでしょうか。実際にはそこは同じ土俵に立っていると思います。

]一色 Silverlightの開発環境について補足しておくと、現在のVisual Studioのフォーム・デザイナ画面では、ドラッグ&ドロップによるデザインが行えません。これにはExpression Blendを利用しなければなりません。Expression Blendは別途購入する必要があります。もちろんVisual StudioでXAMLコードを手書きすることはできますが、効率的な開発にはやはり(本年末あたりでのリリースが予定されている)次のVisual Studio 2010の登場を待つ必要があるので、Silverlightをいますぐ利用するのは厳しいですね。

]八巻 いまならVisual Studio 2010のベータ版が無料でダウンロードして使えます(会場:笑)。

]遠藤 jQueryのUIデザインでは、Visual Studioのフォーム・デザイナは使えないですよね。

]宮崎 使えませんが、IntelliSenseが使ってコーディングできます。

]山田 jQueryが話題になっていますが、ASP.NET AJAX Control ToolkitならVisual Studioのフォーム・デザイナにドラッグ&ドロップして使えます。Visual Studio 2008からはフォーム・デザイナ上でもCSSが適用された形で表示されます。

]一色 先ほどの山田さんの基調講演の中で、Ajax開発には、ASP.NET AJAXなどによるフォーム・デザイナを活用した「サーバ中心の開発モデル」と、jQueryなどによるコーディング主体の「クライアント中心の開発モデル」があるとありました。基本的にはこのとおりですが、「DotNetAge jQuery for .NET」というオープンソース・ライブラリがあり、これを使えばjQueryでも[ツールボックス]からのドラッグ&ドロップで開発できるサーバ中心の開発モデルが採用できます。将来的にはjQueryでもそういうものが出てくるのかもしれません。

DotNetAge jQuery for .NETによるドラッグ&ドロップ開発の実行例

―― 後半では、より実務寄りの話に入っていこうと思います。


 INDEX
  VB研公開ゼミ:テクノロジーバトル 開発者の選択
  第1回 Silverlight vs. jQuery+ASP.NET AJAX
    1.Silverlight、Ajaxのできること/できないことの対決
  2.リッチUI/開発言語/開発環境の対決
    3.クライアント環境/対応OS/クロスブラウザ/SEO対策問題の対決
    4.システム・アーキテクチャ/将来性の対決

インデックス・ページヘ  「VB研公開ゼミ議事録」


Insider.NET フォーラム 新着記事
  • 第2回 簡潔なコーディングのために (2017/7/26)
     ラムダ式で記述できるメンバの増加、throw式、out変数、タプルなど、C# 7には以前よりもコードを簡潔に記述できるような機能が導入されている
  • 第1回 Visual Studio Codeデバッグの基礎知識 (2017/7/21)
     Node.jsプログラムをデバッグしながら、Visual Studio Codeに統合されているデバッグ機能の基本の「キ」をマスターしよう
  • 第1回 明瞭なコーディングのために (2017/7/19)
     C# 7で追加された新機能の中から、「数値リテラル構文の改善」と「ローカル関数」を紹介する。これらは分かりやすいコードを記述するのに使える
  • Presentation Translator (2017/7/18)
     Presentation TranslatorはPowerPoint用のアドイン。プレゼンテーション時の字幕の付加や、多言語での質疑応答、スライドの翻訳を行える
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)
- PR -

注目のテーマ

業務アプリInsider 記事ランキング

本日 月間
ソリューションFLASH