AtomのHydrogenライクなVSCode拡張を作った
AtomのHydrogenライクなVSCode拡張を作った
はじめに
かつてAtomというエディターには、Hydrogenという拡張がありました。
それはエディター内で動作するJupyter notebookのようなREPL環境でしたが、Jupyterにはない優位性を持っていました。
AIコーディングによって開発そのものが移り変わる中、Hydrogenの機能や体験が欲しくなることが今でもありました。
Atom開発終了から長い時間が立ちましたが、HydrogenライクなインタラクティブPython実行環境をVS Codeで実現する拡張機能「Protium」を開発しました。
Hydrogenについて
Jupyterノートブックは対話的な開発環境として広く使われていますが、Hydrogenは独自のアプローチで優れた開発体験を提供していました。
-
純粋なスクリプトファイルで実行できる:
.pyファイル内で実行できて、デバッグしながらプログラムを組むことができる - 自由なコード実行: セル定義が不要で、カーソル位置の行やコードブロック、選択範囲によって柔軟な実行が可能
- インライン結果表示: 実行結果がエディタ内に直接表示され、コードと結果を同時に確認可能
-
複数ファイルからのカーネル共有: 一つのカーネルを複数の
.pyファイルで共有して、モジュール全体を開発できる - サーバーレス: Jupyterサーバー不要で、エディタ内で完結する環境
しかし、2022年にAtomが開発終了したことで、Hydrogenの継続使用が困難になりました。
Hydrogenユーザーはその後あれこれ足掻いてきましたが、VSCodeにおいては現在でも十分な解決には至っていません。
Protiumについて
というわけで、Hydrogenの開発体験をVS Codeで再現することを目指した拡張、Protiumを作りました。
再現した機能
Hydrogenの主要機能は以下のように再現できました：
- 柔軟なコード実行: カーソル位置のブロックを実行、選択範囲の実行にも対応
- スマートなブロック検出: 関数、クラス、制御構文を自動認識して適切な範囲を実行
- リッチな結果出力: Matplotlib、Pandas、画像などの表示に対応
- 複数ファイルでのカーネル共有: 一つのカーネルを複数ファイルから利用可能
- カーネルモニター: 実行状態や接続ファイルを監視
- ウォッチリスト: デバッガライクな変数監視機能
再現できなかったインライン結果表示
Hydrogenの象徴的な機能であるインライン出力（エディタ内に直接結果を表示）は、VS Codeの制約により実装できませんでした。
代わりに、専用パネルでの結果表示を採用しています。この方式では：
- 実行したコードの範囲（行番号）と結果が対応付けて表示される
- エディタのスクロール位置に自動的に追従する
- ファイルごとに結果が保存され、ファイル切り替え時に自動復元される
インライン表示に対して別枠のパネル表示が必要ですが、開発体験としては近しいものを目指しました。
開発方式について
Protiumの開発にはClaude Codeを使いました。諸々困ったところと落ち着いたワークフローについて記しておきます。
現時点において、AIによるコーディングは主に設計力とアルゴリズム力の2点はいささか不安要素があります。
〇〇の機能を実装して、といった単純な実装依頼ではコード量が増すばかりでスマートな設計にならないことが多いです。特に五月雨的に1つずつ依頼すると既存のコードをなるべく保ったまま、冗長的なコードが増産されることになります。
アルゴリズムっぽいことを開発させるときはテスト駆動開発が効果的ですが、if文が連なるアルゴリズムになる可能性があります。
冗長/不要なコードのリファクタリングは明確に方針を示さないとあまり綺麗にはいきません。
最終的には以下のワークフローに落ち着きました：
- 設計方針の複数案検討: 実装には着手させず、複数の設計方針を提案させる
- 人間によるレビュー: 提案された案の良し悪しを判断・選択
- 詳細設計の詰め: 選択した方針に基づいて詳細を詰める
- 実装: 設計が固まってから実装着手
ゼロから設計することが大変でも、出てきた案の良し悪しを判断することは比較的容易です。こちらが具体的な設計方針を持っていなくても、アプローチの利点・欠点を比較しながら具体化することができます。
なんというかとても協業的で、感慨深いものがあります。
おわりに
VS CodeにはHydrogenに近い体験を持つ拡張がなかったので、今更ですが自分で作りました。
ちなみに、AtomはPulsarというエディタに受け継がれています。また、HydrogenもHydrogen-nextというフォークプロジェクトとして残っています。
Discussion