Documentation

The editor is a full Monaco instance with JavaScript syntax highlighting. The current execution line is highlighted as you step, and you can click the gutter to toggle breakpoints. Code runs only in the sandboxed interpreter — never through eval or the VM.

Every executed statement produces one immutable snapshot: the state after that step. You can scrub anywhere in the trace without re-running, because nothing is mutated — each step is a full, independent view.

Use the playback controls to play, pause, step, or jump. The speed selector controls auto-playback pace, the timeline search jumps to statements containing a query, and the mini-map gives an overview of the whole run. Diffing marks exactly what changed between consecutive steps.

The graph view renders the run as a navigable control-flow graph: branch nodes for conditionals, back-edges for loops, and call/return edges for functions. The path taken so far is highlighted, and you can click any node to jump to that snapshot. Use the filters to hide or show specific node kinds.

Click the editor gutter to toggle a breakpoint on a line. Playback stops at enabled breakpoints so you can step manually. Timeline nodes can also be bookmarked for quick reference during a long run.

Select a snapshot and ask for an explanation. The AI returns a summary of what just happened, the concept behind it, and what happens next — streamed in real time when the provider supports streaming. Confidence is reported per explanation.

Three providers are supported:

• Local (offline) — default. Deterministic explanations generated in-process from the snapshot. No network, no API key.
• OpenAI — set OPENAI_API_KEY server-side.
• Google Gemini — set GEMINI_API_KEY server-side.

Keys are resolved on the server and never exposed to the browser. Choose a provider and model in the AI settings dialog. With no key configured, CodeScope falls back to the local provider automatically.

The gallery ships pre-verified examples across categories and difficulty levels. Filter by category, difficulty, or tag; favorite and revisit examples; and load any of them straight into the playground, ready to step through.

Your workspace — code, breakpoints, watches, view, speed, and preferences — can be exported as a .codescope file or a compressed share link, then restored anywhere. Auto-save keeps the last session so you can pick up where you left off. Invalid or foreign files are rejected on import.

Execution happens entirely in the browser. No code, breakpoints, or UI state is sent anywhere. The only network calls are the ones you opt into by configuring an AI provider, and the explanation prompts contain only minimal execution context — never your full source code.