jQuery 座談会

あしたの研メンバーのしおやさんが jQuery の概要を紹介しました。

(2010年3月25日開催)

jQueryはメジャーです

いぬいjQueryってどれくらい普及してるんですか?

しおやかなりメジャーだと思います。最初にAjax勉強しようと思ってライブラリを調べるとjQueryかPrototypeか。あともうひとつふたつありますけど。

かわのAjaxでWebアプリを書こうと思う人は大体使うよということ?

しおや使うよということですね。

かわのそれは重要ですね。

JavaScriptでライブラリを使うわけ

しおやなんでライブラリを使わなくちゃいけないかというと、ブラウザごとに挙動が微妙に違うんですね。これはチュートリアルにでてる例なんですけど、JavaScriptって普通にHTMLの先頭に書いちゃうと読まれた瞬間にすぐ実行されちゃうんですよ。すぐ実行されちゃうとまだページの残りの部分が読み込まれてないのでページに対して操作ができない。じゃあページを全部読み終わってから実行すればいいってことでJavaScript自体はその機能を持ってるんです。window.onloadというイベントがあって読み込みが終わりましたということを教えてくれるAPIは決まってるんですけど、これにはひとつ欠点があってページが本当に全部読み終わらないと実行されない。上にロゴがあったりCSSが貼ってあったりという細かい要素も全部読み終わってからはじめてページが読み終わりましたよというイベントがくるんで、バナーとか貼ってる人にとっては困っちゃう。そこで本体のDOMができたところでとりあえず制御を返して...ということをしたいなと思うとどうもブラウザによって挙動が違う。だから2005年くらいの記事をそういう内容で引くとFirefoxでやる方法、IEでやる方法、でもこの方法Operaではダメでした、みたいなそういうノウハウがいろいろ出てるんですけど、今はこういう(jQueryのような)ライブラリが出てきてそれを全部まとめてくれるようになった。

かわのカプセル化されてるというかjQueryで書けばライブラリの中でやっていることを考えないで済むわけですね。

しおやWindowsでIEナントカに対応してればOK、みたいなアプリケーション書く人はともかくとして、そうでなくてFirefoxでもChromeでも、MacでもWindowsでも動かしたいなと思うと、こういうライブラリを使わないとやってらんない、という状態になってるんで、ライブラリを使わないとJavaScriptのプログラムは書けないと言ってもいいくらいの状態になってます。そのなかでメジャーになろうとしているのがjQuery。

ほとんど個人でやっている?

かわのこれでも誰がやってるんだろう、個人でやってるわけじゃないですよね?

しおやでも個人っぽいんですよね。

かわのこんなすごいものを個人で作ってるんですか!?

しおや最近は組織みたいなものがカンファレンスとかやってるみたいですけど、基本的には個人ベースらしいです。

かわのよくそんな大きい仕事を(個人が)整合性を保って続けられますね。

いぬいそんなに大きくないんじゃないですか?

かわのちっちゃいのか...

しおやえーとプログラム自体はかなりちっちゃいほうですね。JavaScriptなんであくまでも本体のWebページとは別にロードしなきゃいけないんで、やっぱりこればっかりがばかでっかいというのは困っちゃうわけで。

かわのニーズにうまく応えたってことか。

しおやjQueryが賢いのは、データを引っ張ってくる仕組みをjQueryという汎用的オブジェクトできれいに作るという骨組みの設計がうまい。そこにプラグインをどんどん足せるようにしてあるから、機能を拡張するときにそういうところでコントリビューションしやすいようになってるんじゃないかなと思います。(間違ってたらごめんなさい)

かわのたとえ個人でも、そういうふうに着眼点がいいと力仕事にならなくても役に立つような貢献ができるってことか。

Flashとの棲み分け

いぬいjQueryでできることとFlashでできることの棲み分けみたいなのはどうなってるんですかね?

しおや動画をみたりとかはHTML5じゃないとできないとか...

いぬいFlashになっちゃいますよね。(中略)jQueryでできることはおそらくFlashならすべてできますよね?

しおやたぶんそれは間違いない。逆は無理ですね、たぶん。

いぬいFlashのほうが表現力はあるけどプログラミングがめんどくさいということですかね?

しおやなんとなく敷居高いなという感じはしますよね。でもそのかわりFlashはツールがあるからツールでデザインするのはラクなのかもしれません。

Ajaxとhttpの関係

かさい私はAjaxというのはほとんど知らないに等しいので質問したいんですが...さきほどhtmlの一部を書き換えるという話がありましたがそれとhttpプロトコルの兼ね合いというのはどういうふうになってるんでしょうか。httpプロトコルだと"これが欲しい"といったときに結果で返って来るんですよね。そのうちの一部分だけをやりとりする、要するにhtmlのページ全体を送り直すんじゃなくて、それはすでに手元にあってその一部分だけを変えるっていることですよね。それはhttpプロトコルから見るとどんなふうに実現されているのかちょっと(知りたい)。

しおや実はですね、httpプロトコル的に言うとAjaxのリクエストなのか普通のhtmlのリクエストなのかは、もちろんContent-Typeとかは違いますけど区別がつかないです。

いぬいAjaxが動くときはローカルで動いてるわけですよね。(中略)たとえばGoogleマップみたいに地図をどんどん動かそうと思ったらそのつどhttpで取ってくるけど、基本は最初にデータをhttpでガツンと持ってきたらあとはブラウザで動く、ブラウザがインタープリタとして動いていると。もちろんGoogleマップみたいに後で必要があればまたサーバーにhttpで取りに行きますけど、そうでなければサーバーに行く必要もなくってローカルの中でJavaScriptで動かせる。

しおやブラウザが非常に器用になったんで、ローカルの中でアコーディオンみたいな機能も実現できるし、Ajaxを使ってhttpでデータを取ってきて一部だけデータを置き換えるという器用なこともできるようになったんですけど、やりとりする手段そのものはhttpで変わらないです。

いぬいブラウザで何でもできるという...でもまだFlashみたいな(ブラウザの)プラグインがないとできないこともある、と。

DOM要素の指定方法:XpathとCSS

かさいセレクタの指定の仕方で、DOMとXpathがよく似てるような気がするんですが同じようなものと考えてもいんですかね?どちらも階層的なモデルで。

しおやDOMは親ノードがあって子ノードがあって、というデータの構造そのものを表す仕組みなんですよ、ドキュメントのモデルですから。そうすると、ドキュメントとしてはこういうのがありますよという全体の構造はわかったとしてその中の要素にどうやってアクセスするかという問題がでてくる。紙だったらたとえば"2章の1節"でアクセスしてもいいし"何ページ目"といってアクセスしてもいいし、最初の章の次の次の節とかいうアクセスの仕方が考えられる。Xpathというのはそのための仕様のひとつですね。CSSもそのための仕様のひとつ。指している対象はDOMで共通ですけど書き方が違う。(中略)XpathはXMLの仕様のひとつとして発達してきている。CSSはブラウザ側から来てるのでどっちかというとWebの表示の伝統がある指定方法。指される対象が同じなんで概念的には当然似てきます。

ブラウザでいろんなことがやれるように

しおやFlashに限らず最近はWebのクライアント側はけっこうバリエーションがあって、MicrosoftのSliverlightだとかCurlだとかいろいろあってこれからどうなっていくのかな、と思うんですけど、(jQueryのように)JavaScriptだけでできるといじりやすいのはいじりやすい。(中略)今はサーバー側のプログラムもJavaScriptで書くというのもでてきているんだそうです。クライアント側がJavaScriptなんで連携しやすいのが売りなんだそうですけど、そうなるとほんとに境界が...

かわのぼくはこのごろ小さい文書とかプレゼンテーションとかGoogleドキュメントで作っちゃうんですけど、Googleのサイトで使われている技術というのはAjaxなんですか?

しおやAjaxとJavaScriptの組み合わせだと思います。

かわのそれであれだけのことができちゃうんですね。

いぬいたとえばどういうことですか。

かわのGoogleカレンダーとかドキュメントとか。今年に入って使い始めたら慣れてきて、要するにブラウザから出ないでも文書は作れるしプレゼンは作れるし共有はできるし連絡もできるしサイトも作れちゃうし、要するにパソコンを立ち上げてますけどブラウザの中にいることが多いんですよ。だから、こういう状態がもう少し進めばOSは関係なくなるということもあるかなー、と。(中略)

かわのChromeOSってありますよね。あれはOSを作ってるんですか?

しおや全部ブラウザでできるなら、WebブラウザだけのOSを作ればいいじゃないっていう発想ですね。

かわの昔もそういうのあったような...(シン・クライアント)それそれ。いつの間にか聞かなくなりましたね。

ブラウザの箱庭はサーバー・ロックインに通じる

しおやオープンソースのプロジェクトにかかわっている我々の立場からすると、こういうの(jQuery)はオープンでもサーバー側のアプリケーションってオープンじゃないのがほとんどだから、それはそれでかえって困った事態に。

かわのそうなんですよ。けっこうGoogleに依存してくると、ちょっと約束事が変わってたりすると...この前もGoogleカレンダー使っててある日突然カレンダーの属性が増えてて"あれ、こんなの無かったのに?"と思った端から全部の画面にそれがでてきてうっとうしかったんですが、そういうことになるんですね、今度は。いずれGoogleがMicrosoftみたいに支配的になったりすると...

しおやすでになってるような気が(笑)

かさいだってGoogleなかったら何にもできないじゃないですか(笑)

いぬいそうですね。

かわのいまGoogleはいい人のようにふるまってるからいいけど、ある日突然悪い人になったらエラい目に遭いますね。

かさいまあそれはそう。でもそれはやっぱり世界全体から総スカンくらって...

かわのでもMicrosoftと同じであまりにも依存してしまったらそう簡単にリプレースできなくなりますよね。(中略)なかなか難しいな、支配から抜けるというのは。

かわの結局、共通のものを使わないと(データを交換できるという)付加価値が出てこないからみんな同じものを使うことにメリットがあって、そうするとだんだん同じインフラを使う、たとえばみんながWordを使うことに染まっていくわけじゃないですか。だから、便利になっていくことと支配されることを切り分けることがむずかしいですね。

しおややっぱり人が集まってくるっていうのが一番大事で、私PHSユーザーなんですけど、PHSの端末はカスタマイズできるのが楽しいんですけどやっぱりユーザー数の多い端末のほうが圧倒的に便利だなという感じはしますね。なんだかんだ言って、ユーザーが多く集まってくるというのが一番強い。

かわのGoogleバズというのがこの前でてきたんですけど、TwitterとFacebookがかぶったようなサービスになってて、ユーザーを囲い込もうとして全部ウチでできますよというような出し方になってきてるので、やっぱり囲い込みしたんだなというのが使って感じることですね。囲い込まれた先に何があるのかというのが嫌な感じなんだけど。

モバイルの世界も囲い込みへ?

いぬいスマートフォンもiPhoneがアンドロイドに敗れるでしょうね。

かわの本気でいってるんですか、それ?

いぬいいや、ほんとですよ。アンドロイドベースのものってどんどん増えてるじゃないですか。そのうちiPhone負けるんじゃないですか。iPhoneでビジネスやるのすごくむずかしいんですよ。認可がおりないんですよね。ちょっと変わったことやると認可がおりないし、でもAppleは全然説明もしないし、殿様商売とは言わないけどそういう状況じゃないですか。それでもiPhoneに載せたいからこっちもがんばって待ってたり新しくしたりするわけですけど、そういうところがアンドロイドだと縛りがない。

かわのアンドロイドにAppStoreみたいなものがありますか?

しおやあります、あります。好きに作っていいんで自由に営業できるんですけど、今日どこかの記事で読んだところによるとAppleみたいに審査がない代わりにスパム・アプリがやたらと増えちゃって大変ってのがあるらしい。

かわの課金どうするんですか?

いぬいそれこそメーカーとかが出すんじゃないですかね。こういう普通の携帯とかと同じで(といって携帯電話を取り出す)

かわのあれ、iPhone持ってるだけじゃないんですね。何個通信機器持ってるんですか?

いぬい2つですよ。

かわのえ、だってこれもあるじゃないですか(といってPCに接続しているイーモバイル端末を指差す)

いぬいあー、3つですよ。

かわのもう無いだろうね、それ以上?

いぬいあれ、何かあるかな?よくわからない。(一同爆笑)

(以上、インフォサイエンスにて)