ダイナミックなJS開発環境 Bird 開発中!

おはようございます!PILOT神山ラボの山下です。今回は久々にラボらしい投稿です。

コンピューターサイエンス的に面白い開発環境を作っています。今回は、開発に至った背景を中心にお届けします。

動機 − JSは動的言語じゃないか

2015年、Webは衰えを知らず、JavaScriptは隆盛を誇り、FLUXアーキテクチャが浸透し、なのに僕らは未だエディタとブラウザを行ったり来たりしています。

のみくま2 by PILOT
のみくま2 by PILOT

みなさん忘れてるかも知れないけど、JavaScriptは動的言語なんですよ!エディタでシコシコ文字並べて⌘-SなりC-x C-sなり:wなりして、ブラウザ開いて確認なんてしてたら静的言語と一緒じゃないですか。ランタイムで開発して、動的言語のポテンシャルを引き出さなきゃもったいないですよ。

ランタイムで開発するってどういうこと

要するに、生きたインタプリタにエディタが繋がっていればいいわけです。よくあるのは、REPLに繋がったエディタからショートカットキーを叩くと、ファイル全体なり、カーソルの直前の式なりがREPLで評価されるというもので、Lisp界隈で人気の構成です。

Dr. Racket. 上がエディタ,下がREPL.
Dr. Racket. 上がエディタ,下がREPL.

更に進んだものとして、開発環境自体が、生きたインタプリタ(VM)の上で動いていて、しかもそれを使って作るソフトウェアの実行環境も同じインタプリタという環境があります。ある時点での環境の状態を丸ごとダンプして配布できるので、そもそも開発と実行の区別がないと言えると思います。代表的なのはSmalltalk, Selfなどですね。

開発に使う各種ソフトウェアも同じ環境にあるので、クラスブラウザで階層を辿って行って一部を動的に書き換えたりもできます。普通のエディタにはできない芸当ですね。

Pharo. 開発環境と実行環境が同じ
Pharo. 開発環境と実行環境が同じ

エディタでスクリプトファイルを作って、一度インタプリタに投げ込んだら実行中は干渉しないという開発手法では、動的言語の利点が活かしきれません。生きたオブジェクトにベタベタ触って、手垢だらけにしながら開発できるのが動的言語の魅力だと思います。

Bird

生きたインタプリタを使って開発するという手法に興味を持っていただけたかと思います。今回ラボで行っているのはこの手法をJavaScript開発に持ち込もうという実験です。

ブラウザは生きたJavaScriptインタプリタを持っているので、ブラウザ上にWebアプリの開発・実行環境を作れば良いわけです。デバッガやREPLはブラウザ組み込みのdevtoolsが使えるので便利ですね。

先行研究として、前述のSmalltalk環境をブラウザに持ち込もうというプロジェクトがあり、Amber SmalltalkLively Kernelが有名です。

今回開発中のBirdはこれとは一線を画し、汎用の開発環境ではなく、特定のフロントエンドJSフレームワークに特化した動的開発環境としました。従来のアプローチがオブジェクト指向のクラス階層エディタベースであるのと対照的に、関数型のパラダイムを取り入れたFLUXアーキテクチャをベースとしています。関数型アプリケーション開発の為のグラフィカルエディタであるというのも珍しい試みだと思います。

Bird. 開発中の画面
Bird. 開発中の画面. β版を近日公開予定

長くなってきたので、背景説明が終わったところでBirdの詳細については次回とします。お楽しみに!

LISPing at the end of time.