2006-05-24

MochiKit: 軽量 JavaScript ライブラリ

対応ブラウザ: IE6+ Mozilla Firefox1.0+ Opera8.5+ Safari2.0+ Konqueror3.4+

Mochikitここ最近、prototype.js や scriptaculous.js に話題が偏りがちでしたが、MochiKit という JavaScript ライブラリも注目されています。(別に無視していたわけではなく、単に追っかけきれていないだけです。そもそも公開されているライブラリやフレームワークの数が尋常じゃないので..。cf. Round-up of 50 AJAX Toolkits and Frameworks)prototype.js や scriptaculous.js が Ruby on Rails のフロントエンドをサポートしているなら、MochiKit は TurboGears という、Python ベースの Web アプリケーション開発フレームワークのフロントエンドを支えています。

TurboGears のフロントエンドからバックエンドまでブックマークレットを利用したデバッガや、データを昇順・降順に並べ替えられるソータブルテーブル、キーボード操作を意識した Web アプリケーション開発には欠かせないキーイベントの取得、ソースコードビューワーといったようなものまで、ごくごく簡単に設置することができるようになっています。

続きを読む "MochiKit: 軽量 JavaScript ライブラリ"

| | コメント (0) | トラックバック (0)

2006-05-23

scriptaculous.js 関連 2題

今日は、prototype.js(クロスブラウザで Ajax をサポートする JavaScript フレームワーク)を利用して、さまざまイフェクトを提供する Script.aculo.us こと scriptaculous.js から。Ruby on Rails にも同梱されている、今をときめく JavaScript ライブラリなので、ご存知の方も多いのでは?

  1. scriptaculous.js のカンペ - Scriptaculous Cheat Sheet
  2. 画像に反射効果を出すリフレクタ効果 - script.aculo.us Reflector

続きを読む "scriptaculous.js 関連 2題"

| | コメント (1) | トラックバック (0)

2006-05-18

Ajax in Action 邦訳本!

はてなの naoya さんの日記で知ったのですが(naoya さん、訳本のまえがきも書いてるようです)、Ajax in Action の邦訳本が出るんですね。

Dave Crane, Eric Pascarello, Darren James. Ajax in Action. Manning Publications, 2005-01.柏原正三, 株式会社はてな(監訳). Ajaxイン・アクション. インプレス, 2006-06.

193239461301_sclzzzzzzz__4

484432222201lzzzzzzz_1

特価 $28.32($44.95)¥4,998(税込)

前の職場で原書は購入していたんですが、読むどころか、Ajax の勉強そのものがままならないほど忙殺されていて、結局、読めずじまいでした。(T-T)

Amazon.com での評価が高かったのと、目次を見てみる限り、中身が概説書としてかなり充実していたというのが昨年 原書を購入した理由だったのですけど、日本語版、Amazon で ¥4,998 ですか..。間違いなく、これまで出ている日本語の Ajax 本の中ではもっとも概説書としてふさわしい内容になるとは思うんですけど、うーん、そもそも原書からして高いしなぁ。アメリカと違って日本は原則として書店割引できないし、仕方のない値段なのはわかるんだけど..。(^ ^;)

ま、開発者の方ならば、この値段に目をつむってでも迷わず「買い」だと思います。訳文の評価は発売前なので、まだ何とも言いようがありませんが、もし気になるようでしたら原書も併せて購入されるのが良いでしょう。

はてなで「Ajaxイン・アクション欲しい!」キャンペーンをやってますけど、はてなの会員じゃないとダメみたいで激しく残念。目下、自前の MT への移行準備中ということもあって、今、アカウントを作っちゃうと単なる冷やかしにしかならないしなぁ。(^_^;;ゞ

続きを読む "Ajax in Action 邦訳本!"

| | コメント (1) | トラックバック (0)

2006-05-15

Spry - Adobe の Ajax フレームワーク

Adobe が Ajax 用のフレームワーク "Spry" を公開したようですね。目下、XML をベースとした、Photo Gallery, Product Table, RSS Reader の3点のデモが併せて公開されています。なお Spry 本体のダウンロードには Adobe の開発者向けアカウントが必要です。(登録は無料。メールアドレスと大まかな居住地の入力を求められます。)

続きを読む "Spry - Adobe の Ajax フレームワーク"

| | コメント (0) | トラックバック (0)

2006-05-14

niftycube.js - 角丸効果 JavaScript ライブラリ

対応ブラウザ: IE 5+ Mozilla Firefox Netscape 4+ SafariOpera: 表示に乱れあり)

先日、"Nifty Corners Cube" という、ボックスの外枠に角丸効果を出すための JavaScript ライブラリを知りました。「え?今頃知ったの?」って方はともかく、「何でいまさら角丸効果を JavaScript で出す必要なんかあるの?!そんなの、CSS でできるじゃない?」と怪訝に思われる方もいるでしょうが、まずはこの niftycube.js の特徴をご覧あれ。

主要機能

  • 文書構造上、無意味なブロック要素(div など)を HTML 上に記述することなく、単一の div 要素に対してでも角丸効果を出すことができる。
  • (以前に紹介した behaviour.js のように)角丸効果を適用する場所を CSS セレクタで指定できる。
  • CSS の背景色や背景画像などを niftycube.js が自動的に検出してくれるため、JavaScript の記述量が非常に短い。(JavaScript 初心者でも簡単に扱える。)
サンプル 1
サンプル 2

続きを読む "niftycube.js - 角丸効果 JavaScript ライブラリ"

| | コメント (0) | トラックバック (0)

2006-05-07

邦人による Ajax 関連書

今日はかねてからずっと勉強しようと思っていた、Ajax 関係の積んどく本の中から。まだ斜め読みの段階なので、ひょっとしたら後で意見が変化するかもしれません。ま、第一印象ってことで。(^ ^;)

続きを読む "邦人による Ajax 関連書"

| | コメント (3) | トラックバック (0)

2006-01-05

JavaScript ソースが HTML から消える日

[2006-06-10 付記]このエントリーは、2006-01-05 時点のもので情報が古くなってます。現時点で把握している最新情報を「続 JavaScript ソースが HTML から消える日」にアップしましたので、あわせてご参照ください。

Behaviour.js ― JavaScript ソースを (X)HTML から完全分離できるライブラリ

昨日、職場の同僚の人がたまたま見つけた JavaScript ライブラリを教えていただたんですけど、これがもうびっくり!なんと、このライブラリがあれば、イベントハンドラーも含めて JavaScript ソースが (X)HTML の body 内から、ほぼ完全に分離できてしまいます! しかも、HTML 内で JavaScript 関数を適用する場所は、なんと JavaScript ソース内に CSS セレクタを書き込むことで指定!あまり日本では取り上げられていないようですが、設置も簡単だし、何より HTML ソースが劇的にすっきりするので、少なくとも僕はもうコイツを手放せなくなりそうです!

はっきり言います!この behaviour.js という JavaScript ライブラリと CSS セレクタで、html/body内の属性は class や id も含めて 90% 消せるようになります!( IE を無視できればですけど..。(^ ^;) 別に無視しなくても、70~80% は消せるかと思います。)

続きを読む "JavaScript ソースが HTML から消える日"

| | コメント (0) | トラックバック (6)

2005-12-07

Web 2.0 に重大な脆弱性

Web 2.0にセキュリティホール発覚 次期バージョンで改修

Web 2.0 にセキュリティホール?なんてネタが流れました。あくまでネタですが、多少リアリティがあります。(「セキュリティホール」云々はともかく、中身は半分以上事実に則してますし。こういうネタ、結構好きかも。(笑)

http://bogusnews.seesaa.net/article/10257876.html

続きを読む "Web 2.0 に重大な脆弱性"

| | コメント (0) | トラックバック (0)

2005-11-14

工藤拓氏が IT Pro で Ajax の連載記事

最近、Google Suggest や Google Maps、G-Mail など、Google がやたらと火を付けてまわっている Ajax("えいじゃっくす"と読みます)という技術がにわかに Web 業界で流行しつつあります。新しい技術なのかというと実はそうでもなくて、Ajax が Asynchronous JavaScript And XML の略であることからも察しがつくように、ただの JavaScript と XML のコラボレーションです(実は別に XML である必要はなくて、ただのプレーンテキストでも OK だったりします)。「ただの」とはいっても、JavaScript を使うというところがミソで、Asynchronously ― つまり非同期に裏でサーバーとやりとりをして、ブラウザの画面をリロードをせずにその結果を返していくことができます。見た目にサクサク動くので、ものすごく快適なユーザーインターフェイスが作れてしまうのが嬉しいところです。

日本でこの Ajax で

を相次いで試験的に公開するなど、最近 色々と面白いことをされているのが工藤拓氏なんですが、この工藤氏が最近、「作って理解する Ajax」 という連載記事を IT Pro で開始しました。

初回は Ajax と工藤氏が作成されたサンプルの紹介で終わってますが、ちょっと今後が楽しみですね。(^-^)

| | コメント (0) | トラックバック (0)

2005-07-21

世界の新聞を快適に閲覧できる Ajax アプリサイト

Google Maps の話をしたところで、Ajax つながりでちょっと気になるニュースサイトの話をば。いや、ニュースサイトといっても正確には新聞(中国語でいうところの「」(報)の方です。

画像データでみる最新新聞紙面

実は北米(カナダ・アメリカ)系のNewspaperDirect.com という企業のサイトで、PressDisplay というところがあります。ここは 55ヶ国225紙(2005年7月21日現在)の新聞の記事ではなく、紙面そのものを余すところ無くデジタル画像化しているサイトです。とはいえ、残念ながら日本の新聞は目下、スポニチと沖縄タイムズだけで、中国の新聞も英字新聞 2紙(中国日報と上海日報)だけしか公開されていません。(これだけは本当に残念ですが、今後に期待することにしましょう。ちなみに閲覧できる新聞の一覧が NewspaperDirect.com 社のサイトで公開されていますので、気になる方はそちらをご覧ください。)
PressDisplay 画面

実は高速・快適・ビューワーいらずの Ajax アプリ?

普通、新聞の紙面といえば、Flash や PDF も含めて専用のビューワーを使って閲覧しますが、ここでは特別なプラグインを導入することもなく、いきなりブラウザで紙面を見ることができます。紙面は多数の PNG 画像から成っていて、ユーザーは紙面をズームイン・ズームアウトしたり、スクロールしたりさせて見るんですが、驚いたことに、操作がかなり直感的にできてしまう上に、これがかなりスムーズに動作します。目下、NewspaperDirect.com 社のサイトに詳しい技術に関する説明を見出せすにいますが、おそらく Google Maps 似たようなしくみの Ajax アプリケーションだと思います。Flash も PDF も使わずに JavaScript でこれだけ快適なインターフェイスを実現してしまっている訳です。あらためてこの技術の応用の可能性を感じさせられます。

気になるサービス利用料は?


Los Angeles Times Metro や Washington Post など、Smart という印がついている新聞は、なんと記事内容の画像閲覧だけでなく、テキストを抽出したり、その内容を中国語などに翻訳する機能などもついています。このほかにも様々な機能が埋め込まれていますので、是非、関心のある方は一度おためしください。ちなみに利用条件は以下の通り。
利用プランEconomyBasicAdvanced
上限購読紙3170120
購読料金月額(US$)9.9519.9529.95
追加講読料金(US$)0.750.750.75
ブックマーク1030100
全文検索対象single issue
バックナンバー(日分)374

ただし、メールアドレスを登録すれば 7日間試用できる上、1面とサムネイルだけであれば登録しなくても誰もが閲覧することができます

| | コメント (0) | トラックバック (0)

2005-07-18

Google Maps 日本版登場

巷では祇園祭とやらで盛り上がってたようですが、つまらない事情で連休を頭から潰してしまっている小生には、もはや出掛けるゆとりも、くつろぐゆとりもございませんので、今日は手持ちのネタで食いつなぐことにします。(- -;ゞ

Google Maps

皆さん、Google Maps というのをご存じでしょうか?先日、Google Maps の日本版が出たというので試しに使ってみたのですが、やはり凄いですね。MapFan も依然 郵便番号から検索できたりする強みはあるものの、UI(ユーザーインターフェイス)では完全に Google Maps に遅れを取ってしまった感があります。とにかく動作がキビキビしているのと、直感的に地図の縮尺や位置を変更できる点が魅力です。よくみると、マクドナルドやモスバーガーといった大手飲食店チェーン、セブンイレブンなどのコンビニエンスストア、銀行、交・機関の駅やバス停まで入っていて思わず笑ってしまいました。いや、これは凄い!

Google Maps で見た京都四条河原町

"デジタルアーカイブ研究所" Google

Google はデジタルアーカイブという観点でみると、非常に野心的で面白い企業でして、Web ページに止まらず、画像・映像・紙媒体書籍など、手当たり次第にアーカイブ化しようと日夜試行錯誤を重ねているところです。Google Labs なんか覗いてみると楽しいので、知らなかった方は是非一度遊びに行ってみてください。検索文字列を入力している側から Google でよく検索されている文句をオンデマンドで表示するお馴染みの Google Suggest(日本語版あり)、学術論文の引用状況まで調査できるGoogle Scholar(英文中心)、アメリカ主要都市内のタクシー1台1台の現在位置を把握できる Google Ride Finder といった、お堅いものから遊び心が入ったものまで色々あります。

実は Google の最先端はただの Java Script ?

そんな Google で今、流行っているのが Ajax(エイジャックス。Asynchronous JavaScript + XML の略。Asynchronous は非同期という意味。)という技術です。名前はあまり馴染みがないかも知れませんが、別に新しい技術ではなく、要は HTML のいとこ分である XML(eXtensible Markup Language)と Java Script のコラボレーションです。

Java Script と CGI の得意不得意

一般に CGI( Perl/CGI、Ruby/CGI などいろいろありますが、ここでは一括りにしちゃいます)は一人一人のユーザーのリクエストをサーバーが受信して、その答えを HTML の形でその都度吐き出すという形式を取ります。Java Script よりもサーバーや複数のユーザー間でインタラクティブ(対話的)に応対ができることが CGI の長所で、たとえば掲示板システム(BBS)のようなものを得意としています。逆に CGI は一人一人のユーザーのリクエストを原則として一台のサーバーが請け負うので( Google のように分散させることもありますが)負担がサーバー側に集中する上に、ユーザーがリクエストを出す都度 ブラウザをリロードするので、我々は直感的に「動作が重い」と感じてしまうことが多いようです。

これに対して Java Script は HTML の中に直接記述することもできるので、オフラインでも利用できますし(逆にいえば複数のユーザーやサーバーとの間で情報のやりとりをインタラクティブに行うのは苦手)、また一人一人のユーザーの端末内で処理するため、サーバー側の負担が分散し、直感的に「動作が軽い」と感じることがしばしばあります(実は逆にクライアントマシンの負担はそれだけ増すことになります。「軽い」と感じるのはあくまで体感的なものです)。

CGI と JavaScript のいいとこ取りをした技術が Ajax

以上の CGI と Java Script のいいとこ取りをしているのが Ajax です。つまり、ユーザーのリクエストに応じて XML(実はただのプレーンテキストでも可)で書かれたデータを読み取りに行ってその結果を返すという CGI 的な要素と、ブラウザ画面をリロードしないという Java Script 的な軽快さを兼ね備えている訳ですね。ためしに Google Maps を開いたら、その地図をズームアップして、東か西のどちらかに延々と地図をドラッグしてみてください。延々とその先の地図が、ページをリロードすることなく果てしなく表示されますよね。実は裏では地図をドラッグするたびにサーバー側にその先の地図のリクエストを送信して画像を受信しているんです。それを Java Script で動かしていてページがリロードされないから、サーバー側とのやりとりを我々ユーザーに全く意識させないという仕掛けになっています。

ちなみに Google Suggest や Gmail も Ajax で動いてます。こちらも要は JavaScript という古い技術を使っているだけなので、システム要件のハードルが低い(ただし Java Script の書き方によっては逆に特定のブラウザに依存してしまうおそれはあります)のが素敵です。応用範囲は意外に広いかもしれません。

[参考]Hack Google's Ajax !

# 「像」「方」→「・」、「使」「仕」→「損」・「担」→「族」、「出」→「遜」、「園」→「賊」など、どうも部分的に不可解な文字化けを起こしていたようです。お気づきの点がありましたら、ご一報下さい。

| | コメント (0) | トラックバック (8)