WebDLX

0️⃣1️⃣0️⃣1️⃣0️⃣1️⃣0️⃣1️⃣0️⃣1️⃣0️⃣1️⃣

Processor simulator written in TypeScript for the DLX architecture. Inspired by WinDLX.

See all screenshots

Instructions follow WinDLX format and opcode table.

Info: 🦺 Work in progress. Lots of features are missing. Only integer registers are supported. Forwarding is not yet implemented.

DLX simulator can be used as a command line tool, library or a web application.

Motivation

Kinda related to the university course on computer architecture. This was not an assignment, just a fun project. Might abandon at any time or never finish.

Could all of that be done in a better way, with less effort or is WinDLX enough? The answer is YES! But c'mon writing own parser, assembler, getting pipeline stalls to work properly, implementing forwarding, creating in-browser unit tests editor to assert on mem and registers values, just sounds fun!

Features:

• 🎨 Tired of Windows XP look? New, modern UI!
• :www: No need to install, run directly within the browser (asynchronously in a WebWorker)!
• 🔠 Support for WinDLX instructions
• 💅 Syntax highlighting? Oh yeah, we've got that. No more NotePad++ within a VM.
• 📊 Real-time pipeline visualization
• 💾 Register and memory inspection interface
• ✔️ Write tests in JavaScript for program correctness
  • chai.js assertions on register/memory values
  • I'm sorry, I think it's pretty cool
• 📃 Detailed, logs
• 1️⃣ DLX assembly language assembler, including tokenizer, lexer and parser
• 🔍 TODO: Profiler

TODO:

• Implement pipeline
  • Implement basic pipeline
  • Implement stalls (WIP)
  • Implement forwarding
• Implement int registers
• Implement basic immediate arithmetic instructions and sw, lw
• Implement memory preloading
• Implement all instructions
• Implement floating point instructions/registers
• Implement double precision instructions/registers
• Implement jumps
• Implement profiler

Library

Library is written in TypeScript. The only runtime dependency is nanoevents package which contains isomorphic event emitter.

Command line tool

pnpm tsx repl/repl.ts -s <source file>

Web application

Web app is a client-side React application bundled with Vite.

pnpm install
pnpm run dev

Screenshots

VSCode-like Monaco Editor with syntax highlighting:

Real-time pipeline visualization:

Tests:

References

• WinDLX instruction set
• DLX architecture
• DLX pipeline
• Instruction formats
• Building an interpreter in TypeScript