ホームReactvercel-labs/wterm
// archived 2026-04-19
vercel-labs

wterm

Frontend🌱 NEW PROJECT BOOST#WebAssembly#Zig#Terminal#React#TypeScript
GitHub で見る →
138

// 概要

wterm は Zig でコンパイルされた WASM コアを活用し、ネイティブに近いパフォーマンスを実現する Web ベースのターミナルエミュレーターです。DOM に直接レンダリングすることで、テキスト選択やクリップボード操作、アクセシビリティ機能をネイティブにサポートします。このプロジェクトは、React 統合、Markdown レンダリング、ブラウザ内 Bash シェル機能のためのパッケージを備えたモジュール式アーキテクチャを提供します。

// 技術解説

wterm は、高性能な Zig でコンパイルされた WASM コアを活用し、複雑な VT100/VT220/xterm エスケープシーケンスを処理する Web ベースのターミナルエミュレーターです。DOM に直接レンダリングすることで、ネイティブなテキスト選択、アクセシビリティ、検索機能といった標準的なブラウザ機能がそのまま動作することを保証しています。このアーキテクチャは、dirty-row tracking と軽量なバイナリフットプリントを通じて効率性を優先しており、Web アプリケーションにターミナル機能を統合する必要がある開発者にとって堅牢なソリューションを提供します。

// 主要ハイライト

01
コアロジックは Zig で記述され、約 12 KB のコンパクトな WASM バイナリにコンパイルされるため、ネイティブに近いパフォーマンスを実現します。
02
DOM ベースのレンダリングにより、テキスト選択、クリップボード統合、スクリーンリーダーのサポートといったネイティブなブラウザ機能が利用可能です。
03
Dirty-row tracking により、各アニメーションフレームで変更された行のみを再レンダリングすることでパフォーマンスを最適化します。
04
24-bit RGB カラーと代替スクリーンバッファを完全にサポートしており、vim、less、htop といった複雑なツールとの互換性を確保しています。
05
React hooks、Markdown レンダリング、ブラウザ内 Bash シェルを含むモジュール式のパッケージ構造を提供します。
06
WebSocket トランスポートのサポートにより、バイナリフレーミングを内蔵したリモート PTY バックエンドへのシームレスな接続が可能です。

// ユースケース

01
Zig と WebAssembly を使用した高性能なターミナルレンダリング
02
テキスト選択、検索、アクセシビリティのためのネイティブなブラウザ統合
03
React および vanilla JavaScript アプリケーション向けの柔軟なターミナルコンポーネント

// クイックスタート

開始するには、Zig 0.16.0+、Node.js 20+、pnpm 10+ がインストールされていることを確認し、'pnpm install' を実行した後に 'zig build' を実行して WASM コアをコンパイルしてください。'pnpm build' を使用してプロジェクト全体をビルドし、web ディレクトリをサーブするか、指定された dev コマンドで Next.js のサンプルを実行することで提供されている例を確認できます。