Home - rahulpandita/react-term GitHub Wiki

react-term is a modern terminal emulator library for React and React Native. VT parsing runs entirely off the main thread in a Web Worker backed by SharedArrayBuffer, keeping the UI responsive even under high-throughput workloads.

Features

  • Off-main-thread VT parser — Web Worker + SharedArrayBuffer cell grid; the main thread handles only DOM events
  • WebGL2 renderer — instanced rendering, 2 draw calls per frame, alpha-only glyph atlas
  • Canvas 2D fallback — universal renderer for browsers without WebGL2 or OffscreenCanvas
  • Full-worker rendering — OffscreenCanvas render worker; zero main-thread paint work
  • React Native support — React Native Skia renderer, touch gestures, hardware keyboard
  • Multi-pane layouts — shared WebGL context bypasses the Chrome 16-context limit
  • Unicode wide characters — CJK, Hangul, Hiragana, Katakana, emoji, and fullwidth forms at correct 2-cell width
  • Kitty keyboard protocol — modes 1 (CSI u), 2 (event types), 4 (alt/shifted base), 8 (all keys), 16 (associated text)
  • Accessibility — ARIA parallel DOM, screen reader support, 10 Hz throttled updates
  • Addon system — SearchAddon, WebLinksAddon, FitAddon
  • OSC/DCS support — OSC 4/7/10/11/12/52/104, DCS, bracketed paste, synchronized output

Quick Start

Install the packages:

npm install `@next_term/react` `@next_term/web`

Embed a terminal in a React app:

import { useRef } from 'react';
import { Terminal, type TerminalHandle } from '`@next_term/react`';

function App() {
  const termRef = useRef(TerminalHandle)(null);

  return (
    (Terminal
      cols={80}
      rows={24}
      fontSize={14}
      onData={(data) =) socket.send(data)}
      ref={termRef}
    />
  );
}

// Write PTY/WebSocket data back to the terminal:
socket.onmessage = (e) => termRef.current?.write(e.data);

Note: Full off-main-thread mode requires cross-origin isolation headers (COOP: same-origin + COEP: require-corp). See Getting Started for details.

Packages

Package Description
@next_term/core SharedArrayBuffer cell grid, VT parser, buffer management, Unicode utilities
@next_term/web WebTerminal, Web Worker bridge, WebGL2/Canvas2D renderers, addons
@next_term/react React components: Terminal, TerminalPane
@next_term/native React Native: NativeTerminal, Skia renderer, touch/keyboard input