約3年間の努力を経て、アリババグループとアントグループの開発チームの共同の努力により、VS Codeプラグインシステムと互換性のある中国初の高度にカスタマイズ可能な高性能IDE開発フレームワークであるOpenSumiが正式にオープンソース化されました。

I. OpenSumiとは何ですか?

OpenSumi は、垂直産業向けに設計されたデュアルプラットフォーム (Web と Electron) IDE を開発するためのフレームワークであり、参入障壁が低く、パフォーマンスが高く、カスタマイズ性に優れています。

このフレームワークは、アリババグループのタオバオエンジニアリングチームとアントグループのエクスペリエンステクノロジー部門および研究開発効率チームが共同で開発し、標準化されたIDE開発フレームワークです。TypeScript + Reactをベースにコーディングされ、リソースマネージャー、エディター、デバッガー、Gitパネル、検索パネルなどのコア機能モジュールを実装しています。開発者は、当社のスタータープロジェクトをベースにした簡単な設定で、ローカルまたはクラウドベースのIDE製品を迅速に構築できます。フレームワーク自体はVS Codeプラグインエコシステムと互換性があり、OpenSumiをベースに開発された製品では、主流のVS Codeプラグインをシームレスに実行できます。同時に、このフレームワークは開発者に低コストで高度にカスタマイズ可能な多様なビューカスタマイズ機能を提供し、IDE環境におけるほとんどのビューカスタマイズシナリオに対応しています。

IDE開発には、code-serverやTheiaなどのオープンソースソリューションが既に市場に出回っています。なぜ私たちは独自開発を選んだのでしょうか？2019年以降、AlibabaとAnt Groupがすでに多くのIDE製品をリリースしていることに気づきました。これらの製品の多くは初期開発段階は似ていますが、この初期開発作業には数ヶ月から半年、あるいは1年もかかり、多くの反復作業が発生します。さらに、オープンソースソリューションを使用した場合、カスタマイズ機能が限られている、ソースコードへの深い依存関係がある、メンテナンスが困難、社内要件を満たせないなどの問題に遭遇するチームもありました。最終的に、複数のチームの強みを組み合わせ、独自のソリューション開発の道を歩み出すことにしました。

II. OpenSumi の利点は何ですか?

前述の通り、OpenSumiは垂直産業開発のためのフレームワークであり、WebとElectronの両方のIDEにおいて、参入障壁の低さ、高いパフォーマンス、そして高度なカスタマイズ性を提供します。主な機能は以下の通りです。

1. 包括的なビューカスタマイズ機能

主流のブラウザに匹敵するパフォーマンスとコーディングエクスペリエンスに加え、ビジネス指向の垂直分野における類似フレームワークをはるかに凌駕するカスタマイズ機能を提供します。基本フレームワークをベースに、モジュールやプラグインを通じてIDE製品を自由にカスタマイズできるため、真の「フルビュー・カスタマイズ」機能を実現します。

多くの社内製品実装フェーズでは、保守性向上のため基本機能を実装するモジュールを使用し、ビジネスビューや機能をカスタマイズしてより高度なカスタマイズを行うプラグインを使用するのが一般的です。Alibaba社内のR&Dシナリオを例に挙げると、階層構造は次のようになります。

2. 垂直産業における研究開発支援の豊富な経験

OpenSumiは正式にオープンソース化される前、アリババとアントグループ内で2年間インキュベーションされ、垂直分野における一連の代表的なR&D事例が蓄積・実装されました。皆さんが思い浮かべるR&D実践シナリオのほとんどは、OpenSumiで見つけることができるでしょう。

• ミニプログラム開発シナリオ

ミニプログラム開発シナリオでは、Alipayミニプログラム開発ツールとTaobaoミニプログラム開発ツールがOpenSumiをコアフレームワークとして採用しています。現在までに、月間開発者数は2万人を超えています。

ツールバーの貢献ポイントと追加のSUMI APIを使用することで、プラグインを介してさらに詳細なビューのカスタマイズが可能になります。例えば：

1) さまざまなツールバーの表示をカスタマイズする

2) 独立した通信可能なウィンドウ スケジューリングを実装します (エミュレーター内など)。

同時に、基盤機能とプラグイン機能の共通化により、エンドツーエンドの迅速な移植も可能になりました。Alipayミニプログラム開発ツールの関連プラグインを移植することで、機能は類似しているもののユースケースが異なるTaobaoミニプログラム開発ツールの初期バージョンへのサポートをわずか1ヶ月で完了し、同時にO2クライアントを社内向けにインキュベートしました。

• クラウド統合型R&Dパイプライン

クラウド統合型の研究開発パイプラインには、社外ではAlibaba Cloudのクラウド開発プラットフォーム、社内ではO2やAnt Codespacesなどの製品があります。

典型的な研究開発プロセスを下の図の上部に示します。

プロジェクトを開始する前に、多くの場合、単純または面倒な環境設定作業が必要になります。また、コーディング環境がクラウド環境から切り離されている場合もあります。Alibaba Cloudなどのクラウド製品のコンテナ機能を活用することで、OpenSumiを通じて企業やチーム向けのクラウドコーディング環境を構築できます。これにより、開発者は環境設定の手間を省き、すべての開発作業をクラウド内で完了できるようになります。

徹底的なプロセスのカスタマイズにより、開発者はすぐに開発状態に入ることができます。

社内のR&Dプラットフォームと統合することで、開発、テスト、展開をワンストップで完了できます。

• 純粋なフロントエンドセットアップ

純粋なフロントエンドセットアップ機能は、AlibabaとAnt Group内でOpenSumiの最も広く利用されている機能です。この機能は、エディタの起動に必要なNode.jsサービスをサーバーに依存せずに、基本的なエディタインターフェースを構築する方法を提供します。純粋なフロントエンドリソースと静的インターフェース定義を通じて直接構築できます。

コア実装では、ファイルやGitなど、元々Node.jsに依存していたサービスをサービスレイヤーに抽象化することで、開発者がファイルの読み書きといったサービスの具体的なロジックを手動で定義できるようにしています。同時に、OpenSumiが提供するWeb Worker APIをベースに、言語サービスはブラウザのWeb Worker環境で実行されるため、Node.jsを必要とせず、フレームワーク構築と純粋なフロントエンド環境を実現しています。

この実装をベースにすれば、GitHub REST API を利用した純粋なフロントエンドエディタを簡単に作成でき、GitHub コードを直接表示、編集、コミットできます。後ほど、関連するサンプルの作成を検討します。内部的には、典型的なアプリケーションには以下のシナリオが含まれます。

1) コードレビュー

2) コードのデモンストレーション

3) リモート筆記試験

OpenSumiコードリポジトリ（opensumi/ide-startup-lite）に、簡単な入門サンプルも提供しています。プレビューページからデモを直接ご覧いただくこともできます。

3) VS Codeプラグインの完全サポート

IDEフレームワークをよくご存知の方なら、Theiaはよくご存知でしょう。VS Codeプラグインと互換性のあるIDEフレームワークとして、Theiaは確かにVS Codeプラグインの一部の機能をサポートしていますが、後継のVS Code APIとの互換性は低下しており、基本的にはコミュニティ開発者による発見と貢献に依存しています。

OpenSumiは当初からVS Codeプラグインエコシステムとの互換性を考慮して設計されているため、フレームワークに対する継続的な要件があります。オープンソース化後、3ヶ月ごとにVS CodeプラグインAPIの適応作業を完了する予定です。適応計画の策定は、ディスカッションフォーラムにおいて関係バージョン管理者によって調整されます。現在、VS Code v1.60.0バージョンの標準APIへの適応が完了しています。進捗状況は適応計画でご確認いただけます。

III. OpenSumiと市場の主流フレームワークとの違い

設計の初期段階では、VS CodeとTheiaのソースコードを徹底的に調査しました。実装プロセスでは、VS Codeプラグインエコシステムや主流エディタの一部機能とエクスペリエンスとの互換性を確保するため、設計と実装の一部において、両氏の実装を参考にしました。対応するコードブロックには、著作権ヘッダー情報が付与されています。

1. VS Codeとの関係

VS Codeは、大きな市場シェアを持つIDEですが、本質的にはIDE製品です。当社のフレームワークとは性質が異なり、全体的にToC製品です。開発者がカスタマイズするための敷居とコストは比較的高く、カスタマイズ可能な内容も比較的限られています。拡張のほとんどはプラグインによって行われています。

当社のフレームワークは主に B2B ユーザーを対象としており、IDE フレームワークを使用して独自の CloudIDE/ローカル IDE 製品を構築する必要があり、十分な技術的研究開発能力が不足している中小企業に、シンプルで便利な開発オプションを提供します。

2. テイアとの関係

注目の的であるTheiaは、ここ数年でVS Codeの設計コンセプトを取り入れながら着実に成熟を遂げてきました。コミュニティも比較的活発です。Eclipse Foundationの支援を受けており、IDE開発者にとって優れた開発オプションであり、OpenSumiフレームワークと競合しています。

Theia自体は、IDE製品をモジュール方式で構築する機能を提供します。ビューのカスタマイズのほとんどはモジュールを通じて拡張できます（これはOpenSumiでも採用したアイデアです）。プラグイン機能に関しては、ほとんどのVS Codeプラグインと互換性があり、VS CodeプラグインAPIの機能のサブセットを提供します。一部のプラグインAPI（デバッグ、言語など）は完全に実装されておらず、今後の対応予定はありません。

上記の点を踏まえ、OpenSumiフレームワークは、基本的なモジュールベースの拡張機能をサポートするだけでなく、プラグインレベルでVS Code標準API（現在VS Codeバージョン1.16.0で実装済み）をフォローアップする計画も進行中です。さらに、フロントエンドサンドボックスを実装し、プラグインを通じてビュー機能を自由に拡張できる一連のSumi APIを提供しています。Reactに精通したフロントエンド開発者は、豊富なAPIを使用してフロントエンドコンポーネントの作成を開始し、対応する機能ビューを実装できます。

IV. 結論

OpenSumiのオープンソース化は、私たちにとってまだ小さな一歩です。皆様からのフィードバックをお待ちしております。ぜひOpenSumiを使って、ご自身のIDE製品を構築してください。

最後に、OpenSumiにご興味をお持ちいただけましたら、opensumi/coreリポジトリにアクセスして、コードとフィードバックをフレームワークにご提供いただければ幸いです。大変光栄です。

• プロジェクトアドレス:

https://github.com/opensumi/core

• 公式ウェブサイトアドレス：

http://opensumi.com