This does not fix the issue where webkit browsers cannot use it, I looked at webkit versions in safari and was a bit confused. The wikipedia page for safari shows v15 having webkit v612+ but I have safari v16 and it's webkit v605, so trying to detect it based on webkit version is a risky change. Note that webgl2 shipped in safari 15, but it didn't work in webgl until safari 16. Fixes #3357 Related #3575 Related microsoft/vscode#165416
xterm-addon-webgl
An addon for xterm.js that enables a WebGL2-based renderer. This addon requires xterm.js v4+.
Install
npm install --save xterm-addon-webgl
Usage
import { Terminal } from 'xterm';
import { WebglAddon } from 'xterm-addon-webgl';
const terminal = new Terminal();
terminal.open(element);
terminal.loadAddon(new WebglAddon());
See the full API for more advanced usage.
Handling Context Loss
The browser may drop WebGL contexts for various reasons like OOM or after the system has been suspended. There is an API exposed that fires the webglcontextlost event fired on the canvas so embedders can handle it however they wish. An easy, but suboptimal way, to handle this is by disposing of WebglAddon when the event fires:
const terminal = new Terminal();
const addon = new WebglAddon();
addon.onContextLoss(e => {
addon.dispose();
});
terminal.loadAddon(addon);
Read more about handling WebGL context losses on the Khronos wiki.
See also
- xterm-addon-canvas A renderer for xterm.js that uses a 2d canvas that can be used as a fallback when WebGL is not available