GAE/J で日本語記事リンク付きの jQuery Plugin まとめサイトを作ってみた
前々から GAE/J で何か作ってみたいと思ってたのですが、あまりネタも思いつかなかったので、とりあえず jQuery Plugin のまとめサイトを作ってみました。
機能紹介
見たまんまなので、特に説明は要らないかと思いますが一応..
- 1)カテゴリ
- プラグインのカテゴリのリンクです。リンクのクリックで対象のプラグインのリストが名前順で表示されます。 New Plugin をクリックした時のみ データの登録日付、名前順で表示されます。
- 2)プラグイン名
- プラグインのプロジェクトサイトにリンクしてます。
- 3)日本の国旗
- 和製プラグインの場合に日本国旗のアイコンが表示されます。
- 4)製作者名
- twitter のアカウント、もしくは、はてな ID が確認できたプラグインのみ製作者名が表示されます。
- 5)非対応ブラウザ
- 非対応ブラウザを赤字の取消し線で表記します
- 6)カテゴリ2
- 1)と同様のリンクになってます。
- 7)Demo
- デモページのリンクになってます。
- 8)登録日付
- データの登録日付。新着プラグインの場合は赤字で表示されます。
- 9)日本語の記事
- 日本語の解説記事のリンクになってます。基本紹介系の記事のリンクは１つとして、２つ以上のリンクについてはプラグインの活用ノウハウについての記事になってます。
仕組みの話
データの収集方法
はてブから Webフックを使ってブクマそのままのイメージで一旦 Big Table 上にデータを保存してます。タグ付けには特定のルールを設けており、プラグインサイトのリンク、デモページのリンク、日本語記事のリンクかを判別できるようにして、カテゴリ、和製、製作者(twitter/はてなID)の情報も付加して登録します。
このデータが一定量溜まったら、タグ付けの情報を抽出して正規の テーブル（ KIND ）に登録し直し元データを削除してます。
データストアのアクセス方法
GAE/J の公式サイトをみると JDO によるアクセス方法を推奨してるようですが、GAE に詳しい方々のブログを見る限りあまり評判が良くない（無理やり RDB ライク名 API にしてるせいで嵌るらしい）ので、low-level API を使用してます。
フレームワークは使用してませんが、通な方々の間では Slim3 (http://sites.google.com/site/slim3documentja/) のデータストア API の評判が良いようですので、将来的には使ってみたいと思ってます。
クライアントサイド
GAE/J のアプリケーションのスピンアップが遅い件はいろいろなところで言われてますが、スピンアップ時のサーブレットで Big Table にアクセスしてるとさらに遅くなるので、体感速度を上げるためとりあえず初期画面では html のレイアウトのみ出力し、データの取得（Big Table のアクセス）はページロード後に Ajax で行うようにしています。
プラグインリストの表示にも Ajax ベースな Autopager を使ってます。Autopager で取得したデータはキャッシュしておき別カテゴリの表示をした場合でも、未取得分のデータのみを取りにいくようにしてあります。
カテゴリリストの固定位置表示には exFixed (http://d.hatena.ne.jp/cyokodog/20090323/jQueryExFixed) を使ってるので、IE6 でも他のブラウザと同様に表示されます。
