Every feature, and where to see it work.

What JSpark does.

All 48 features of JSpark, from the editor to the page. The 15 marked JSpark+ come with JSpark+. Each group has its own page, that shows it at work.

The Timeline

Replay a Node Run one Step at a time, backwards too, with every name in scope at each Step.

The Timeline: Replay a Node Run one Step at a time, backwards as easily as forwards. Nothing runs again.
Variables at each Step: Every name in scope, as it stood at each Step. Hover a name to see its value then.
Closures, marked: In the Timeline, a name a function remembers from further out is marked as remembered.
Objects as they were: In the Timeline, an object shows what it held at each Step, not what it became later.
Next Step with output: In the Timeline, jump straight to the next Step that printed something.
Longer recordings JSpark+: The Timeline records up to 2,000,000 Steps, where JSpark records 5,000.
Inside lines JSpark+: Step into each call, callback and loop check, and see what each one came to.
The Call Stack JSpark+: At every Step of the Timeline, see which functions called the one you are in, and in what order.

Your Snippet runs a moment after you stop typing, in real Node. A loop that never ends is stopped.

Run as you type: Pause and your Snippet runs. The last answer stays on screen until the new one arrives.
Real Node: Errors, stack traces and timer order are Node’s own. A Snippet runs as a Module or a Script.
Endless loops, stopped: A loop that never ends, or a Run that’s busy too long or uses too much memory, is stopped.
Values shown as they are: Map, Set, BigInt and circular objects are shown as they are. Error lines link to the code.
Every console method: console.table, groups, timers and %c styles work as in a browser. Each line links to its code.
Every top-level value: Print the value of each top-level expression, each at its line, not only the last one.
Longer, bigger Runs JSpark+: Set a time limit of up to 10 seconds and 256 MB to 8 GB of memory, or press Run longer.

End a line with //? and its value appears beside it, after every Run.

Peek: End a line with //? and its value appears beside it. Add $.length to see just part of it.
Every pass of a Peek JSpark+: Hover a Peek inside a loop to see the value it had on every pass, not only the last one.

TypeScript checked as you type, with nothing to set up. Completions, Format Code and Vim keys, all offline.

TypeScript, checked: Type errors are underlined as you type, with hovers. You decide if they hold the Run.
Completions: The editor completes names as you type, in JavaScript and TypeScript, and knows Node’s own APIs.
Vue and Svelte, typed: A Vue or Svelte Snippet is one component file. With lang="ts", it is type-checked too.
Format Code: Prettier is built in and works offline. One key formats the code on screen.
Vim keys: Switch the editor to Vim’s modes and motions. The shortcut to Run, and every other, still works.
Editor extras JSpark+: Tailwind class suggestions, Format Code before every Run, and your own format style or .prettierrc.

A Web Snippet is a real page beside the editor. Change only the CSS, and the page keeps its state.

A real browser page: A Web Snippet’s page runs beside the editor in its own process, so it can’t hang JSpark.
Style edits keep the page: Change only the CSS and the running page takes it in place, keeping its state.
The last working page: An edit that breaks the build leaves the last working page up, with the line to fix.
Pages keep their state: Switch to another tab and back: a page keeps its state while you are away.
CDN imports: A Web Snippet can import a package from a CDN, and import maps work too.
Tailwind, offline: Import Tailwind in a Web Snippet’s style and it compiles in the app, with no connection needed.
Open in Browser JSpark+: Open a Web Snippet’s page in your own browser, with its DevTools. It reloads as you edit.
A page with a server JSpark+: Web Page + Server and React + Server Snippets, each side with its own console.

React, Vue, Svelte, three.js and more, each opening on a small demo that runs.

14 Starters: React, Vue, Svelte, three.js and more, each opening on a small demo that runs.
Solid, as Solid runs it: Solid Snippets compile with Solid’s own compiler, so they behave as in a Solid project.
Your Starters JSpark+: Put the Starters in the order you like, and hide the ones you don’t use, so the list stays short.

A Node Snippet runs on real Node, with your own access to your files, the network and other programs.

Files and network wait for you: A Snippet that reaches your files, network or other programs doesn’t run as you type. It waits for Run.
A folder for your files: Relative paths and __dirname land in one Working Folder. Reveal it in Finder, or pick your own.
Environment variables: Keep up to 3 values, such as an API key, in process.env instead of in your code.
Run in your folder JSpark+: Run a Snippet in a folder of your own, so it can import your files and use your packages.
More variables JSpark+: Keep as many environment variables as you need, and load the Working Folder’s .env.

Search npm and read any package, in both editions. With JSpark+, install it once for every Snippet.

Install packages: Install, update and remove npm packages. JSpark can search them and read them.

Save the Snippets worth keeping, with notes and Tags, and find one again by any word in it. Saving needs JSpark+.

Save to the Library: Save Snippets to the Library, edit them, and import a Library from a file.

Tabs that come back, your layout, your look, and a window that can stay on top.

Tabs that come back: Quit whenever you like. The Snippets you had open are there when you return.
Open and save files: Open a .js, .ts, .html, .vue or .svelte file in a tab, and save a tab back to a file.
Your layout: Code and output side by side or stacked. A page and its console are tabs, each with the whole side.
Keep on top: Keep JSpark above other windows, so the output stays in view while you work elsewhere.
Your look: A light theme and a dark one, code colours to go with each, and your text size.
Unlimited tabs JSpark+: Keep as many Snippets open as you like. JSpark keeps up to 3 open at once.
Every look JSpark+: Every app theme and code colour, JetBrains Mono, and Fira Code with ligatures.