見て見ぬふりをしていた問題
これまでの Saboten 開発で見て見ぬふりをしている問題があった。
それは、コーディングしたテキストデータの脇に表示されるコード名が折り返し表示されないという問題である。同一のテキストに対して複数のコーディングをすると表示されるコード名が長くなる。本来はその場合、折り返し表示をしてすべてのコード名が見えるように実装していたはずだが、実際には途中で見切れてしまっていた。
何度かそれを修正しようとも試みていたが、毎回失敗している。
薄々気づいていたのだが、デバッグをしようにもファイルが複雑過ぎて上手く行かないのである。データを表示している DocumentPane が 2500 行を超えるコンポーネントになっていて、Claude が一度に読めなくなっていた。なので修正作業をしても的外れなものになり、何も改善されない。これを何度も繰り返していた。
大幅なリファクタリングをしないとデバッグのスタート地点にも立てない。Claude がファイルの全体像を把握できるようにしないと、いつまでたっても堂々巡りしそうだ。
しかし、リファクタリングの過程で別の問題もたくさん出てくるだろうし面倒くさい……としばらく放置していた。
リファクタリングのきっかけ
ようやく重い腰を上げてリファクタリングに取り組んだのが昨日である。
直接的な理由は、X を見ていたら、React の公式ドキュメントをもとにコードレビューをしてくれるサブエージェントをつくっている人を見つけたことだろう。
これを活用すれば、いまの複雑怪奇なコードがどうにかなるのではないかと思われた。
間接的な理由は、土曜日にみんなで群馬をめぐりながら AI 駆動開発についてしゃべってやる気が出たからである。研究全般に関してそうだが、たくさんしゃべる時間が発生するととりあえずやる気が出る。
そしてデバッグへ
リファクタリングを段階的に進めていった結果、巨大な単一コンポーネントが、機能別にいくつかのコンポーネントに分かれた。
そのおかげで、自分も Saboten のどこに問題が生じているのかを Claude に直接コンポーネント名を名指して伝えられるようになった。また Claude の方も、問題が一つのコンポーネントで起きているのか、その関連コンポーネントまで見に行った方がいいのかを判断しやすくなっているように思える。
コード名の折り返し表示問題の場合、表示領域の幅が、どの階層のコンポーネントによってどう制御されているのかが不明なのが問題だった。リファクタリングによってそれが追跡できるようになった結果、ついに長年の問題が解決した。
（コード名が二重に表示されるのはどんな仕組みによるのかは別途検討すべき問題）
質的データ分析ソフトを壊しながら考える
嬉しいことに、こうしてピンポイントに検討したい箇所を扱えるようになったので、ただデバッグをするだけでなく、質的データ分析にとってここはどのように表示されるべきだろう？という議論も Claude にしやすくなった。
コード名の表示スタイルが今の状態がベストなのかはわからないが、今後は色々実験することができるだろう。
リファクタリングのおかげで「実験的に質的データ分析ソフトを壊す」という選択肢ができたのが重要だと思っている。リファクタリング前は、実験しようにも実験とは関係のないところが一緒に壊れてしまうので、試行錯誤しづらかったように感じる。
今後は機能を追加するだけでなく、既存の状態を壊して考えるというアプローチも取っていきたい。
Discussion