Playground

Real Node.js, running in this page. Pick an example, edit it, and press Run (or Cmd/Ctrl+S). Each run is a new process in its own Web Worker; the files live in an in-memory filesystem that only exists in your tab.

Live Node terminalHello, NodeAn HTTP serverFiles and streamsChild processesOpen in Studio ↗

node - index.js

index.jsCmd+S / Ctrl+S to run

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

import os from "node:os";
import { createHash } from "node:crypto";

console.log("Node", process.version);
console.log("platform:", os.platform(), "(in a browser tab)");

const hash = createHash("sha256");
const digest = hash.update("hello from wcvm").digest("hex");
console.log("sha256:", digest.slice(0, 32) + "...");

let total = 0;
for (let i = 1; i <= 5; i++) {
  total += i;
  console.log("tick", i, "sum", total);
}

console.log("done - edit me and hit Run again!");

import os from "node:os"; import { createHash } from "node:crypto"; console.log("Node", process.version); console.log("platform:", os.platform(), "(in a browser tab)"); const hash = createHash("sha256"); const digest = hash.update("hello from wcvm").digest("hex"); console.log("sha256:", digest.slice(0, 32) + "..."); let total = 0; for (let i = 1; i <= 5; i++) { total += i; console.log("tick", i, "sum", total); } console.log("done - edit me and hit Run again!");

Terminal

Ready. Edit index.js and press Run.

What to try

• Hello, Node: ESM import, node:crypto hashing, and process.version.
• An HTTP server: a real http.createServer() and http.get() talking over wcvm's virtual network.
• Files and streams: fs, readline and a read stream over an in-memory file.
• Child processes: execSync and spawn, each child being another worker.

A run is stopped after 15 seconds. For long-running servers, npm install, a file tree and a live preview, open Studio: it is the same runtime with an editor, terminals and project templates.

Embed it in your own page

The demo is a few hundred lines of Vue plus wcvm itself: see apps/docs/.vitepress/theme/LiveDemo.vue. Your page needs the cross-origin isolation headers.