タイトルそのまんま。
「Vue.js を部分的に導入すると、あとで後悔するほどカオスになりがちなのでは？」
という事を、Vue.js と jQuery のキメラ生物となってしまったシステムの仕事をしていて、そう思ってしまった。
なにぶん歴史のあるシステムだし、多分、最初は jQueryだけで構成されていたと思う。
それから
「jQuery 何とかしたいよねー。」
↓
「何かフロントエンドフレームワーク使ってみたいよねー。」
↓
「よし！ それなら部分的導入可能な Vue.js だ！」
・・・と、こんな流れだったんだと思う。多分。
いや、その時の状況を知らないんで、推測でしかないけど。（開発した人は既に退職）
別ウィンドウを表示し、そこから選択した内容を元の画面に返す処理が Vue.js で書かれていて、それ以外のメイン画面の処理は jQueryで書かれていたんで、おそらく、jQueryで実装されている部分が元々あって、新しく追加する独立性の高い機能を Vue.jsで書こう、という流れだったんじゃないかという、そんな気がした。
何が辛いかというと、まず、イベント管理が辛い。
作りのせいかもしれないが、Vue.jsの処理で必要なイベントと、jQueryの処理で必要なイベントがあって、それぞれがどんなタイミングで実行されているのか、トレースが非常に難しくなっている。
改修が必要な場合にも辛みを発揮する。
多分、メイン画面の方を jQueryで処理している関係で MVVMの構成にできなかったのか、メイン画面で作成したコントロールをDOM操作で拾い、Vue.js側に必要な値を渡すという構成になっているため、ちょっとした修正でも、やたらと気を回す部分が増えてしまう。
修正内容次第では、「Vue.jsを廃止する」or「全てを Vue.jsで完結させる」の２通りを本気で考えてしまうケースもあるが、どちらかを必ず選ばないといけない場面になったら、少なくとも今回のプロジェクトでは Vue.js 廃止の方を選ぶ。（超テンション上がらない仕事になるけど）
というか、部分的に Vue.js を導入した場合、そうなるケースの方が多そうな気がする。全面リニューアルに近いレベルでのリプレイスでない限りは。
「部分的に Vue.jsを導入する」
と言う事は、
「既存の jQueryがデカすぎて、全部をいきなり置き換えるのは現実的じゃ無いから、ちょっとした部分を Vue.jsで書こう。」
というパターンだと思う。
つまり、コードの行数的には
「jQueryのコード ＞＞＞＞＞ Vue.jsのコード」
となっている。
そう言う状況下で、
「どちらかを１つに統一させないと修正も今後のメンテナンスも無理！」
となってしまった場合、Vue.js を削除して jQueryで書き直す方法でないと、現実的な工数として出せないケースが多いんじゃないかと思う。
そうやって部分的に Vue.jsを導入した場合、バージョンアップに追従するのが難くなるし。
現に今のプロジェクトは 1系で止まったままだ。
仮に頑張って Vue.js に書き換えるにしても、今更1系で書き換えるのは流石にアホらし過ぎてやるべきじゃないし、メジャーバージョンを上げるとしたら修正範囲が一気に広ががり、現実的な工数が出しづらくなる。
（そこまでやるならバージョンアップに追従していく体制を作るところまでセットにするべきだし。）
せっかく頑張ってフロントエンドフレームワークを導入したのに、jQueryに取って代わられてしまうという、もはや何がしたかったのか分からなくなる状況は十分生まれ得るという感覚があった。
「比較的簡単かつ、部分的に導入できる」
というのはメリットかもしれないが、後々、とんでもない技術負債を抱えてしまうのではないかと思った次第だ。
そう考えると、切り売り不可のフルセットで提供している Angular の方向性は正しい気がしている。
・・・いや、Angular 実務でちゃんと触った事ないからよく知らないけど。
コメント