VS Codeの紹介
こんにちは、OSSのレキシラジオです。
このポッドキャストでは、エンジニアであるhentekoが、毎週一つのOSSプロジェクトを取り上げて、
そのプロジェクトにまつわるレキシを紹介する番組になります。
今週のテーマは、VS Codeのレキシについてです。
それでは見ていきましょう。
まず、VS Codeについてなんですけど、正式名称はVisual Studio Codeといいます。
マイクロソフトが開発する、Windows、Linux、MacOSなどのクロスプラットフォームで動作するようなソースコードエディターです。
開発としては、Electronをベースとしていて、特徴としては、簡単に機能を追加できるような拡張機能を備えています。
そして、さらに特徴として、コア機能にあたるエディター部分のところはすべてOSSとしてMITライセンスで公開されています。
さらに、去年のスタックオーバーフロー2024年デベロッパーサーベイでは、最も使用されている統合開発環境としてVS Codeがランクインしていたそうです。
プロジェクトモナコの背景
さてここからは、VS Codeのレキシについて解説していきたいと思います。
少しだけ時は遡って15年前、2010年代初頭のソースコードエディター環境というのは、大きく分けで二極化した環境になっていました。
1個目がIDEと呼ばれる、例えばビジュアルスタジオ、コードじゃない方ですね、ビジュアルスタジオとエクリプス、またはインテリジェなどのIDEというところが流行っていました。
こちらのIDEに関しては、主にJavaやCシャープ、Cプラプラなどの静的片付け言語向けのエディターになっていました。
特徴としては、コードの補完やリアルタイムのエラー検出、複雑なリファクタリングや高度なデバッグ機能というところが強みとしてありました。
ただ反面ですね、既存の遅さやメモリ消費量の多さなどがあって、軽快さに欠けるというところがデメリットとして存在していました。
逆にですね、軽量エディターというところもありまして、これに関してはLIMやEmacs、サブライムテキストなどがガイドするかなという形です。
こちらの特徴としては、起動が早くて反応速度も高速というところが限られます。
特にコンパイル不要なクリプト言語ですね、例えばRubyだったりとかPerlだったりとかっていうところを扱うウェブ開発者に好まれていたのかなと思います。
欠点としては、コードの保管の弱さとか、高度なリファクタリングやコードジャンプなどをしようとするとですね、複雑な設定とか、追加のプラグインのインストールが必要になってしまうというところがありました。
こういった環境ですので、開発者の人数としてはですね、当然のようにIDEのような高機能とテキストエディターのような軽快さというところを兼ね備えたツールの需要というのが非常にありました。
さらに追い風としては、2012年にですね、TypeScriptの登場、こちらもマイクロソフトが開発しているんですけど、TypeScriptが登場したことによって、
JavaScript環境、JavaScriptを主に使っていたウェブ開発の中でも静的片付けっていう機能が求められるようになってきました。
これらのニーズっていうのをVS Codeが誕生したきっかけになるんじゃないかなと言われています。
さらにVS Codeの歴史を語る上で重要になるのが、プロジェクトモナコというようなプロジェクトです。
こちらに関しては、2011年にスイスのチューリー市のマイクロソフトチューリー市デベロップメントラボというところで開始されたようなプロジェクトになります。
このプロジェクトモナコを率いていたのがエーリックガンマさんです。
このエーリックガンマさんは知っている方もいるかもしれないんですけど、デザインパターンという本の著者の一人で、
プラスでエクリプス、先ほど紹介したIDのエクリプスのアーキテクトでもあった人です。
そのエクリプスの開発の中で、プラグイン同士の干渉によるパフォーマンスの低下だったりとか、
UIの被害化による問題っていうところに直面していたというような経験を持っている方でした。
そういった方がマイクロソフトの本社から離れた位置関係で、既存のビジュアルスタジオのチームの制約に縛られない形で新しいアプローチによる開発をしていくというのがプロジェクトモナコというものです。
ElectronとVS Codeの設計
このプロジェクトモナコというのがどんなものなのかというと、目的としてはブラウザで動くエディタの開発というのを目的として掲げていました。
もともとデスクトップエディタの開発の目的では実はなかったんですね。
そもそもマイクロソフトのクラウド関係であるAzure上のウェブサイトをブラウザから直接編集する手段のために開発されていたツールというのがプロジェクトモナコで開発していたモナコというようなツールです。
実はこのモナコ、現在もモナコエディターという名前でGitHubの方でOSSで公開されているものになっています。現役のエディターのツールです。
このモナコに関してはフルのタイプスクリプトでの実装されていて、ウェブベースの技術でありながら堅牢な型安全性で開発されていました。
これが後々にVS構造の安定性の基礎になったということが考えられるかなと思います。
さらにオート速度を早めるためにリアクトやアンギラなどの既存のUIフレームワークを排除して独自のDOM操作レイヤーを開発したというところもあります。
さらにウェブの標準技術のみで開発していたので特定のOSの依存はないような形の設計になっていました。
そんな形でモナコというのが開発されていたんですけど、最終的にはVisual Studio Onlineモナコという形で公開されました。
こちら先ほどの目的通りブラウザ上で動作するようなエディターになっています。
ただここの段階では開発者のローカルマシン上のファイルを編集したいというニーズの方が強くあって、なかなか流行らなかったというのがあります。
しかしモナコエディター自体は完成度が高くて、後の定格に再利用されることになったというところがあります。
この完成度の高さというところは応答速度や他のロジックなど、既存のUIフレームワークを排除して独自のDOM操作レイヤーによるツールを作っていたので、
すごい早く動作したというところがモナコにはあるのかなと思います。
そういったところが現在でもモナコエディターとして存在するという理由になっているかなと思います。
さて次のお話なんですけど、プロジェクトキチーノというプロジェクターがあります。
こちらはモナコを活かしつつローカルでの開発に応えるために、ローカルファイルを編集するための開発に応えるために、
ウェブ技術でデスクトップアプリケーションを作るというような方向性に転換したプロジェクトモナコというような形です。
スイスのティチーノ州にちなんでプロジェクトキチーノと命名されたそうです。
こちらに関しては、当時どういった形でデスクトップアプリケーションを作っていくのかというところを
エリックガンマーさんたちは頑張って調べたり開発していたりしたんですけど、
当時まだ独立企業だったGitHubの方で開発されていたエディター、Atomというものがあるんですけど、
そちらの方で使われていたAtomShell、こちらの後にElectronと名前が変わるんですけど、
そちらの方、Electronを使って開発を開始するというような形になりました。
このElectronに関しては、Chromiumなどを中で使って、
Web技術でデスクトップアプリが作れるよというような形のフレームワークになっています。
そのElectronを使いつつ、Electronをあくまでも側として利用して、
その中のコア技術として、モナコエディターというのを入れて統合するという形になっています。
そもそもモナコエディター自体がWeb技術で作られていたもので、かなり信用性が高かったのかなというところです。
さらに先行して開発されていたエディター、Atomエディターですね、GitHubの方が開発していた、
Atomエディターの問題点として挙がっている拡張機能をメインプロセスで動作させるというような設計に、
Atomエディターになっていたんですけど、
こちらが影響して、Atomは重い動作になってしまうというようなものがありました。
さらにエリック・ガンマンさんがEclipseの開発していた時のプラグイン時刻というところの
虚空を生かした設計にVS Codeはなっています。
その具体的なところとしては、プロセスの分離というところが非常に強いところになっています。
拡張機能というのがVS Codeはあるんですけど、
そちらはメインプロセスで動かさない、エクステーションホストプロセスというところで実行されるようにしました。
絶対にメインプロセスであるUIスレッドに影響を与えないというところで設計されています。
これはテキストエディターがテキストを入力する、ユーザーが入力する時に入力を邪魔しないようにするというような設計になっています。
さらに非同期通信の強制というところもあります。
UIと拡張機能というところは通信というのは全て非同期による通信のみを行えるようにしたというところがあります。
こうすることによって拡張機能がクラッシュしたとしてもメインプロセスであるUIスレッドには何の影響もないというような形になっています。
この設計の違いが同じエレクトロンを使っているようなAtomエディターとの違いになったかなと思います。
ちなみにAtomについては後にマイクロソフトやGitHubを買収後、2022年に開発の方が終了するというような形になりました。
VS Codeの登場とオープンソース化
さて、そういった形でVSコードの開発というのがされてきたんですけど、2015年の4月にマイクロソフトの開発者イベントビルドでVisual Studio Codeが正式に発表されました。
あのマイクロソフトがWindowsだけではなくてMacOSやLinux向けにもアプリを提供したというような驚きというのが当時あったかなと思います。
これというのは特にあったのが、サティア・ナディラCEOが掲げていたMicrosoft Loves Linuxというスローガンによるものが大きかったかなと思います。
同年、2015年の11月にはVSコードをOSSとしてGitHub上で公開されています。
こちらが先ほど言ったMITライセンスで公開されているVSコードのものです。
名前としてはVisual Studio Codeという名前はついていないんですけど、CodeOSSという名前で公開されています。
こちらは製品版であるVisual Studio Codeと別本の代表というような形で名前がつけられています。
VSコードに関してはすべてOSSの機能で成り立っているというような形です。
プラスアルファ製品版の方にはOSSとして公開されていない拡張機能とか入っているんですけど、そういった違いがあるというような形になっています。
分かりやすい例としてはGoogleのChromeとChromiumの関係に近しいかなというところがあります。
こうすることによって、Microsoftはオープンソースのコミュニティの知見を取り込みつつ、
企業として品質とブランド管理というのができるようにするようなハイブリッドな戦略を取っているというような形になっています。
LSPとDAPの重要性
さて、次はVS Codeを語る上で重要なLSPとDAPについてお話ししたいと思います。
LSPとDAP、2つあるんですけど、まずはLSPからですね。
Language Server Protocol、LSPというものなんですけど、こちらはプログラミング言語の保管などをサポートする仕組み、プロトコルです。
これが何かというと、Language Serverというプログラミング言語のサーバーを実装することで、
LSPに対応したツールであればすべて使えるようになるという仕組みです。
基本的にこういった保管に関しては従来はエディターごとに言語のサポートを実装していました。
例えばEclipseなどであれば、JavaのLanguage Server的なものが内部に実装されていて、
Javaの保管が効くみたいな形になっていました。
これがLSPであれば、例えばRubyのLanguage Serverを1個開発すれば、
LSPに対応したエディターはそのLanguage Server、RubyのLanguage Serverを再利用するということができるような形になりました。
このLanguage Serverの再利用性というのが拡大に向上したというところが、
LSPの非常に大きなところです。
このLSPなんですけど、2016年にオープンな標準化がされまして、
現状ではプログラミング言語のエコシステムにおいて事実上の標準となっています。
このLSPのおかげで、VS Codeに関しては様々な言語環境を高速にサポートすることができる環境を
整えることができたというところが、VS Codeの成功の要因ではないのかなというところがあります。
さらにですね、DAP、こちらはLSPとちょっと似たような形なんですけど、
デバッグ機能についてのデバッグアダプタプロトコルとしてのプロトコルです。
こちらの方はLSPとは違って、エディターとデバッグの間を中間するような役目になっています。
VS Codeでは、こういったDAPを使うことによって、どんなデバッグの実装にもよらずに、
統一されたUIで様々な環境のデバッグというのが可能になったという形になります。
このLSPとDAPに関しては、VS Codeを語る上で非常に重要なツール、プロトコルになっているので、
少しご紹介をしました。
さらにですね、VS Codeはどんどん進化していて、
2019年にはですね、リモートデベロップメーターエクステンションパックというようなものをマイクロソフトは発表しました。
これはどういったものかというと、ローカルのVS Code経由でですね、
リモートサーバーにあるファイルの編集やコマンド実行、
デバッグなどを行うような仕組みです。
接続としてはSSHで行っているんですけど、
リモートサーバー上にあるファイルを直接編集することができるというような形になっています。
物理的なサーバーやVPSはもちろんのこと、どこかコンテナ内もサポートするというような形になっていました。
これによってですね、何が嬉しいかというと、
ローカルにはVS Codeだけインストールすれば、
開発環境はリモートにあるというような状況を作ることができるようになりました。
これによってローカルの環境構築自体ということを極力なくすことが可能という形になりました。
そしてプラスアルファですね、これがさらにすごいんですけど、
2021年にはですね、GitHub Codespacesというものがリリースされまして、
そちらと連携することでリモートの開発環境ですね、
先ほどのリモートサーバー上にある開発環境というところも
ほぼほぼ構築するのがほぼ自動化するということができるようになりました。
これによってですね、VS Codeさえインストールすれば、
いつでも誰でも開発環境がすぐさま手に入るというような形の環境を手にすることができるようになっています。
さらに進化して、2021年同年ですね、今ですね、VS Code.Devというのをリリースしました。
こちらはブラウザ上で動作するようなVS Codeです。
これによって、そもそもVS Codeをローカルにインストールする人生がなくなったというところがあります。
これは一番最初に紹介したプロジェクトモナコのところですね、
プロジェクトモナコの目的がブラウザ上で動作するエディターだったので、
こちら、まさにその構想、プロジェクトモナコの構想が約10年を経てここで花開くことになったという、
ちょっと胸安展開かなと思っています。
AIエージェントの統合と進化
そんなこんなで、VS Codeは現在、これを聞いている皆さんもお使いかなと思うんですけど、
AI時代ですね。AI時代に関してVS CodeはAIの連携というのを進めているような形になっています。
GitHubコーパイロットヒットに、AIによるコーディング機能というのがどんどん拡充していっているという形です。
さらにですね、VS Codeをカスタマイズする形で、
マイクロソフト以外の会社がAIエージェントをネイティブ統合したエディターというのを開発されてきています。
有名なところだと仮想だったり、あとAWSのキロだったり、
最近リリースされたんですけど、Googleアンチグラビティだったり、
そういったもののAIエージェントがネイティブ統合されていたっていうのはすべてVS Codeがベストしつつ、
その上にAIエージェントを乗せてっていうような形で構築されているので、
VS Codeは規定になっているというようなところが結構あるかなと思います。
この流れに関しては今後もエディターへのAIエージェントという統合はかなり加熱してくるかなと考えてますので、
個人的には非常に楽しみだなと思って未来を見ているところです。
さて最後にまとめたいと思います。
VS Codeは当時はプロジェクトモナコとしてブラウザで動作するエディターとして開発されていました。
その後デスクトップアプリとして方向転換し、
LSPやランゲージサーバープロトコルやデバッグアダプタープロトコルなどのプロトコルを開発し、
現在で標準化されるまでになっています。
さらに現在進行形でVS Codeをベースとした新しいAIエージェント付属のエディターが開発されていっているというような状況です。
では今回のVS Codeの歴史についてはここで終わりにさせていただければなと思っております。
もし少しでも今回の話がいいねと思ったらお聞きのプラットフォームでの高評価とフォローの方をお願いします。
またXなどでハッシュタグOSSの歴史ラジオで感想などつぶやいてもらえると励みになります。
次回はVS Codeの基盤となっているエレクトロンの歴史について見ていきたいなと思っておりますので、
次回もよろしくお願いいたします。バイバイ。
