numbl web IDE#

Run MATLAB-syntax .m files in your browser with numbl, inside a VS Code-style IDE built on minwebide. Projects live in your browser's IndexedDB.

Live site: https://concept-collection.github.io/numbl-web-ide/

The landing page manages projects (create / rename / duplicate / delete), each with its own file system, addressed as #/project/<id>. Create a sample project and press ▶ on a script:

• Text output streams to the Output panel; figures open as Figure N views in the secondary side bar (rendered by numbl's own figure renderer — 2-D canvas, 3-D three.js).
• The whole project is the workspace, numbl.org-style: functions next to the running script resolve automatically, other folders via addpath.
• Runs use the current editor contents (saved or not), execute in a Web Worker, and can be stopped with ⏹.
• Files a script writes (fopen/fprintf) appear in the Explorer.
• Scripts can install packages from the mip registry: mip load --install inpoly (see scripts/mip_demo.m in the sample).
• The project name in the status bar takes you back to the project list.

mip packages#

The mip package manager and installed packages live in a system store — a dedicated IndexedDB database shared by all projects — and never appear in a project's Explorer (unlike numbl.org, which shows them under a system/ prefix). The mip core tooling is fetched in the background when the IDE opens; every run merges the system files into the interpreter's virtual file system and puts the mip directory on the search path, so mip load, mip install, mip list, etc. work as in the numbl CLI/IDE. Packages a script installs are written back to the system store after the run, so they're reused across runs, reloads, and projects. After 30 minutes of inactivity the store is wiped and mip core is re-fetched on next use (keeping the mutable mip-numbl release fresh); installed packages re-install on demand via mip load --install.

Development#

minwebide is consumed as a sibling checkout (file:../minwebide):

git clone https://github.com/magland/minwebide ../minwebide
(cd ../minwebide && npm install)   # fetches the pinned VS Code source
npm install
npm run dev

• npm run build — static bundle in dist/
• npm run typecheck — typechecks app code (vendor diagnostics suppressed)
• npm run smoke — headless end-to-end test against the built bundle
• bash scripts/generate-builtins.sh — refresh the syntax-highlighting builtin list after upgrading the numbl dependency

Cross-origin isolation: dev/preview servers send COOP/COEP headers so SharedArrayBuffer is available (numbl uses it for pause() timing). The deployed site gets the same via coi-serviceworker.js, injected into index.html only at build time — dev never registers a service worker.

CI checks out magland/minwebide next to this repo, installs both, builds, and publishes dist/ to GitHub Pages.