Ghostty for the Web: A High-Performance xterm.js Alternative

Web Development

Ghostty-web offers xterm.js API compatibility with a WASM-compiled, battle-tested VT100 emulator from the native Ghostty app, providing superior web terminal performance.

Ghostty for the Web: A Powerful xterm.js Alternative

Introducing Ghostty for the web, offering xterm.js API compatibility and delivering a proper VT100 implementation directly in your browser. This project makes the robust terminal emulation of the native Ghostty application available for web environments.

Seamless Migration

Migrating from xterm.js to ghostty-web is straightforward. Simply change your import statement:

- @xterm/xterm
+ ghostty-web

Core Features

  • WASM-compiled parser from Ghostty, leveraging the same battle-tested code that powers the native desktop application.
  • Zero runtime dependencies, resulting in a lean bundle size of approximately 400KB WASM.
  • Originally developed for Mux, a desktop application designed for isolated, parallel agentic development, ghostty-web is engineered for broad applicability across various projects.

Try It Out

Experience ghostty-web firsthand:

Live Demo

Access a Live Demo hosted on an ephemeral VM (special thanks to Greg from disco.cloud for providing this).

On Your Computer

To run a local demo with a real shell:

npx @ghostty-web/demo@next

This command initiates a local HTTP server accessible at http://localhost:8080. For optimal performance, this demo works best on Linux and macOS.

Comparison with xterm.js

While xterm.js is widely adopted in environments like VS Code, Hyper, and numerous web terminals, it presents fundamental challenges:

Issuexterm.jsghostty-web
Complex scriptsRendering issues✓ Proper grapheme handling
XTPUSHSGR/XTPOPSGRNot supported✓ Full support

xterm.js implements terminal emulation entirely in JavaScript, requiring manual coding for every escape sequence, edge case, and Unicode quirk. In contrast, ghostty-web utilizes the same robust and battle-tested emulator code that powers the native Ghostty application, ensuring superior accuracy and performance.

Installation

npm install ghostty-web

Usage

ghostty-web is designed to be largely API-compatible with xterm.js. Here's a basic example:

import { init, Terminal } from 'ghostty-web';

await init();

const term = new Terminal({
  fontSize: 14,
  theme: {
    background: '#1a1b26',
    foreground: '#a9b1d6',
  },
});

term.open(document.getElementById('terminal'));

term.onData((data) => websocket.send(data));
websocket.onmessage = (e) => term.write(e.data);

For a comprehensive client-server communication example, please refer to the demo repository.

Development

ghostty-web is built from Ghostty's source code, incorporating a patch to expose additional functionality. Building this project requires Zig and Bun.

To build:

bun run build

Mitchell Hashimoto (the author of Ghostty) has been actively developing libghostty, which is the foundation making this web version possible. Thanks to the Ghostty team's efforts, the necessary patches are very minimal and are expected to shrink further over time.

This library will eventually integrate a native Ghostty WASM distribution once it becomes available, while continuing to offer an xterm.js compatible API.

At Coder, we are enthusiastic supporters of Ghostty, and we extend our sincere kudos to the team for their outstanding work.

License

This project is licensed under the MIT License.