それなりに JavaScript で UI をサポートするようにしたところ、 jQuery を使っていてもコード量が増えてきた。 ready メソッドも膨らんできてぼちぼちなんとかしないといけないなあと感じる。増えてきたといっても 400 弱ぐらい(ready は 40 ぐらい)でまだいいのかもしれないけど、ここで放置するといつの間にか 1000 行越えて修正に時間がかかるようになるのが怖い。これからも機能が増えていくことは分かっている。
ずっと悩んでいても仕方ないのでひとまずロード時からの描画部分、ボタンクリックなどの操作周り、そのアクションによってビューが変わるアクション層(と勝手に自分で決めた名前) と、 Ajax によって取得したデータを管理、そのデータを楽に提供できるサービス層 (これも勝手に自分で決めた名前) に分離してみた。
サービス層でリアルタイムに取得したデータをコールバックでアクション層に返し描画する。取得した生データをサービスでキャッシュしておき、そのデータをいじるようにすれば DOM を直接いじることはかなり減る。
そんなこんなで ready 関数にあった関数はアクションの中に入って 20 行ぐらいになった。こうして振り返ると当たり前のことをしていなかっただけな気がしてきた。