はい。先週のブログに書いた通り、
個人的に一番面白いと感じた
「Seasarで動いているWebサービスCacooの裏側」
のセッションについてのメモ等をさらそうかと。
とりあえず、資料はこちらにさらされてます。
一応このブログにも埋め込んでみる。
Tags: Etc
資料内のアジェンダにも書かれてるけど、
今回お話してた内容は、
・Cacooとはなんぞや？
・Cacooが動いてるアーキテクチャの構成
・Cubbyで拡張して何をどう実現してるか
・デザイナーさんとの協業方法
・レスポンスの改善
・質疑応答
って感じでした。
以下、セッションを聞きながらのメモを時系列で。
資料内のアジェンダにも書かれてるけど、
今回お話してた内容は、
・Cacooとはなんぞや？
・Cacooが動いてるアーキテクチャの構成
・Cubbyで拡張して何をどう実現してるか
・デザイナーさんとの協業方法
・レスポンスの改善
・質疑応答
って感じでした。
以下、セッションを聞きながらのメモを時系列で。
資料と重複してる部分や、意味不明な所は抜いた・・・はず。
Cacooはヌーラボが運営・開発している
ヌーラボの仕事
→カクー、Backlog、受託開発を行っている
受託で作ったものをOSSに還元して、
その作ったものをさらに自分たちのサービスで使用している
Cacooとは？
VisioのWeb版
いろいろかけるよ！
・フローチャート
・UML
・ネットーワーク図
・座席配置図
図を描くだけでもなかなかイケてるけど、
リアルタイムコラボレーションもできるよ！
同じオブジェクトを触っている場合先勝ちになる。
別オブジェクトの場合マージされるよ
何のために作ったか？
本社が福岡のため、東京のお客さんとBacklogで文字だけでやり取りするのは結構きつかった
図も使ってたけど、pptで書いてpngにして、と面倒くさかった
ほかの人が編集できなかった
というわけで、図を直接みんなで編集できたりしたらいいなぁということで作った。
図が描けるツールが当時はあまりなかった
最初はUMLをWeb上で書くことができるようなプロトタイプを作った
JSONで情報やりとり
その後FlexやFlashを使えばクロスブラウザ問題を解決できそうだったので
ので社内で利用する為のプロトタイプを作成
社内プロジェクトで運用してみて、いけそうだったので、
Webサービスとして提供した
7ヶ月でユーザー数が現在4万4千超
国数は120カ国以上
ユーザーは英語版が57％以上
英語じゃない問い合わせが来てたりして、ユーザー対応が結構大変・・・
Cubbyで拡張
・脱Strutsを目指した
・T2も同じ感じ？
Plugin
AOPを使わずに拡張していく
それぞれフックできるポイントが提供されている。
Mayaa
・テンプレートの切り替えができる
Cacooはリリース以前から多言語対応を念頭においていた
多言語対応用に日本語・英語のリソースをすぐに切り替えられるようにした
１．最初に開発者のみでプロトタイプHTML・機能を作成
→使いやすさを追求
２．次にイメージを作成
→イメージをデザイナに伝えて、デザイナにサイトデザインを作ってもらう
３．出来上がったイメージはイラレやPNGだったりするので、デザイナさんに
それぞれパーツとして切り出してもらい、HTMLコーダーにパーツを渡し、コーディングしてもらう
id/classのルールが重要
Cacooではs_で始まるid/classは開発者側で使うというルールを規定し、
それ以外はHTMLコーダーに自由にやってもらった
４．出来上がったHTML/CSSからMayaaで仕上げる
→動的なコンポーネントを含める
→JavaScriptでDOMで表示するようなものを含めてもらう
５．日本語の表示が終わったら多言語対応
→翻訳したい単語・文章をリストアップして、翻訳者に渡す
失敗したと思ったこと。
翻訳者のCacooへの理解が足りず、翻訳してもらったものが
ちょっとオカシなものになっていた。
→実際にユーザーに指摘してもらって修正した
Mayaaとは
・最初がはまりやすい
→公式ドキュメントを参照しましょう
すでにメーリングリストで質問されている事がたくさんある
→JSPと同じ考え方で表示しようとするとハマりやすい。
Cubbyのカスタムタグの連携を用意にする拡張もあったりする。
レスポンスの改善
通信速度・距離の問題
アメリカからCacooやBacklogにアクセスしてみたところ
画像が表示されないという問題が発生。
サーバーキャッシュ→Ehcacheで解決（主に画像）
RMIで複数台で分散してキャッシュをするようにしている。
基本はネットワーク通信を減らす・DBアクセスを減らす
ブラウザのキャッシュ
タイムスタンプが重要
Mayaaの応用
InjectionResolverを拡張して、pom.xmlのバージョンを設定、
JSのバージョン等を動的に変更させるようにした
Hudsonでリリースモジュールを作成することによって、
リリース漏れをなくすようにした。
回線速度やレイテンシの問題
→今EC2に乗っけるかどうかを検討している。
現状海外からのアクセスが国内からのアクセスに比べて30倍位遅くなっている。
InjectionResolverを用意しておくことによってEC2に乗り換えたときも
リソースのパスなどの修正もあまり入らないと考えている
まとめ
CacooはSeasarプロダクトを基盤として動作しています。
Seasarを使うことによってサービス開発に集中できました
Seasarを使って魅力的なサービスをじゃんじゃんつくっちゃいましょう！
Javaだって今風なWebアプリ作れるぜ！
質疑応答
・HTML5導入は？
当時検討もしたが、当時はIE優勢だったので、見送った。
HTML5に切り替えればロードが早くなるのは
わかっているので是非やりたいと考えている。
Canvasは早いことはわかっている
英語じゃない質問はどうしてるの？
質問をGoogle翻訳で邦訳し、英語で返答している。
開発チームの人数は？
リリース直前は4名
3，4ヶ月で開発
インフラ構成は？
アプリケーション4台、DB2台？でかなり余裕
現状はたぶん2，3台でまわせる
以上。
最近話題になっているであろうCacooの裏側の事情が聞けて、
非常に興奮しました。
Cacooはヌーラボが運営・開発している
ヌーラボの仕事
→カクー、Backlog、受託開発を行っている
受託で作ったものをOSSに還元して、
その作ったものをさらに自分たちのサービスで使用している
Cacooとは？
VisioのWeb版
いろいろかけるよ！
・フローチャート
・UML
・ネットーワーク図
・座席配置図
図を描くだけでもなかなかイケてるけど、
リアルタイムコラボレーションもできるよ！
同じオブジェクトを触っている場合先勝ちになる。
別オブジェクトの場合マージされるよ
何のために作ったか？
本社が福岡のため、東京のお客さんとBacklogで文字だけでやり取りするのは結構きつかった
図も使ってたけど、pptで書いてpngにして、と面倒くさかった
ほかの人が編集できなかった
というわけで、図を直接みんなで編集できたりしたらいいなぁということで作った。
図が描けるツールが当時はあまりなかった
最初はUMLをWeb上で書くことができるようなプロトタイプを作った
JSONで情報やりとり
その後FlexやFlashを使えばクロスブラウザ問題を解決できそうだったので
ので社内で利用する為のプロトタイプを作成
社内プロジェクトで運用してみて、いけそうだったので、
Webサービスとして提供した
7ヶ月でユーザー数が現在4万4千超
国数は120カ国以上
ユーザーは英語版が57％以上
英語じゃない問い合わせが来てたりして、ユーザー対応が結構大変・・・
Cubbyで拡張
・脱Strutsを目指した
・T2も同じ感じ？
Plugin
AOPを使わずに拡張していく
それぞれフックできるポイントが提供されている。
Mayaa
・テンプレートの切り替えができる
Cacooはリリース以前から多言語対応を念頭においていた
多言語対応用に日本語・英語のリソースをすぐに切り替えられるようにした
１．最初に開発者のみでプロトタイプHTML・機能を作成
→使いやすさを追求
２．次にイメージを作成
→イメージをデザイナに伝えて、デザイナにサイトデザインを作ってもらう
３．出来上がったイメージはイラレやPNGだったりするので、デザイナさんに
それぞれパーツとして切り出してもらい、HTMLコーダーにパーツを渡し、コーディングしてもらう
id/classのルールが重要
Cacooではs_で始まるid/classは開発者側で使うというルールを規定し、
それ以外はHTMLコーダーに自由にやってもらった
４．出来上がったHTML/CSSからMayaaで仕上げる
→動的なコンポーネントを含める
→JavaScriptでDOMで表示するようなものを含めてもらう
５．日本語の表示が終わったら多言語対応
→翻訳したい単語・文章をリストアップして、翻訳者に渡す
失敗したと思ったこと。
翻訳者のCacooへの理解が足りず、翻訳してもらったものが
ちょっとオカシなものになっていた。
→実際にユーザーに指摘してもらって修正した
Mayaaとは
・最初がはまりやすい
→公式ドキュメントを参照しましょう
すでにメーリングリストで質問されている事がたくさんある
→JSPと同じ考え方で表示しようとするとハマりやすい。
Cubbyのカスタムタグの連携を用意にする拡張もあったりする。
レスポンスの改善
通信速度・距離の問題
アメリカからCacooやBacklogにアクセスしてみたところ
画像が表示されないという問題が発生。
サーバーキャッシュ→Ehcacheで解決（主に画像）
RMIで複数台で分散してキャッシュをするようにしている。
基本はネットワーク通信を減らす・DBアクセスを減らす
ブラウザのキャッシュ
タイムスタンプが重要
Mayaaの応用
InjectionResolverを拡張して、pom.xmlのバージョンを設定、
JSのバージョン等を動的に変更させるようにした
Hudsonでリリースモジュールを作成することによって、
リリース漏れをなくすようにした。
回線速度やレイテンシの問題
→今EC2に乗っけるかどうかを検討している。
現状海外からのアクセスが国内からのアクセスに比べて30倍位遅くなっている。
InjectionResolverを用意しておくことによってEC2に乗り換えたときも
リソースのパスなどの修正もあまり入らないと考えている
まとめ
CacooはSeasarプロダクトを基盤として動作しています。
Seasarを使うことによってサービス開発に集中できました
Seasarを使って魅力的なサービスをじゃんじゃんつくっちゃいましょう！
Javaだって今風なWebアプリ作れるぜ！
質疑応答
・HTML5導入は？
当時検討もしたが、当時はIE優勢だったので、見送った。
HTML5に切り替えればロードが早くなるのは
わかっているので是非やりたいと考えている。
Canvasは早いことはわかっている
英語じゃない質問はどうしてるの？
質問をGoogle翻訳で邦訳し、英語で返答している。
開発チームの人数は？
リリース直前は4名
3，4ヶ月で開発
インフラ構成は？
アプリケーション4台、DB2台？でかなり余裕
現状はたぶん2，3台でまわせる
以上。
最近話題になっているであろうCacooの裏側の事情が聞けて、
非常に興奮しました。
投稿
