MyLang Compiler + AsmIDE Project Documentation

Overview

MyLangCompiler + AsmIDE is a Blazor WebAssembly-based IDE and compiler toolchain for a custom 8-bit computer architecture. MyLang is a custom language compiler targeting a custom 8-bit ISA I made I while ago, see my blog post about it: EECS Blog: 8-bit Computer in an FPGA

Initially I was going to make a C compiler for learning/fun but then I thought I'd be nice if I actually made simple compiler for my 8 bit computer I made.


Web App: AsmIDE + MyLang Compiler

GitHub Repo: 8-Bit Computer


The project combines:

Core Purpose

The system enables users to:

  1. Write code in a simplified educational programming language
  2. Compile it into assembly or machine code
  3. Debug symbol mappings
  4. Upload binaries to custom hardware

High-Level System Architecture

System Architecture

Project Structure

MyLangCompiler/
│
├── Code/
│   └── Compiler.cs              # Full compiler pipeline
│
├── Pages/
│   └── Home.razor               # Main IDE UI
│
├── Layout/
│   └── MainLayout.razor         # App shell
│
├── NpmJS/
│   └── MonacoInterop.js         # Monaco code editor integration
│
├── wwwroot/
│   ├── js/
│   │   ├── JSUtils.js
│   │   └── SerialInterop.js     # Browser serial APIs
│   │
│   └── Test/                    # Sample programs and generated code
│
└── README.md / ARCHITECTURE.md

Compiler Pipeline

Compilation Stages

Compiler Pipeline

Compiler Internals

1. Lexer (Tokenizer)

Responsibilities

The lexer scans raw source code and converts it into structured tokens.

Supported Token Types

Features

Lexer Workflow

Lexer Workflow

2. Parser

The parser converts tokens into an Abstract Syntax Tree (AST).

Supported Statements

Labels

start:

Variable Assignment

x = 5;
y = x + 2;

Printing

print(x);

Goto

goto start;

Conditional Blocks

if x > 5 {
    print(x);
} else {
    print(0);
}

Parser Architecture

AST Structure

3. Abstract Syntax Tree Design

The AST preserves logical program structure while abstracting syntax.

Example Source

x = 5;
y = x + 2;
print(y);

AST Representation

AST Example

4. Code Generator

The code generator transforms AST nodes into target assembly.

Internal Responsibilities

Code Generation Flow

Code Generation Flow

Assembly Instruction Set

Default Opcodes

Instruction Purpose
LDA Load from memory
LDAD Load immediate
STA Store accumulator
ADD Add
SUB Subtract
OUT Output
JMP Unconditional jump
JMC Jump on carry
JMZ Jump on zero
HLT Halt

Arithmetic Handling

Native Support

Emulated Support

Multiplication

Implemented using repeated addition loops.

Division

Implemented using repeated subtraction loops.

This allows high-level arithmetic on minimal hardware.

Variable & Memory Model

Memory Layout

Memory Layout

Key Concepts

Output Modes

1. Assembly

Human-readable generated assembly.

2. Machine Code

Binary/encoded opcode output.

3. Symbols

Assembly plus:

Compiler Entry Point

Main API

Compiler.Compile(
    sourceCode,
    bits,
    outputType,
    opcodeDefinition,
    memAddressLength,
    memWordLength,
    memSize
)

Steps:

  1. Lex source code
  2. Parse token stream
  3. Build AST
  4. Generate code
  5. Resolve labels/variables
  6. Output selected format

UI Architecture

UI Architecture

Strengths of the Design

Advantages

Current Limitations

Known Constraints

Recommended Future Improvements

Compiler Enhancements

IDE Enhancements

End-to-End Example

Source

x = 5;
y = x + 2;
print(y);

Compilation Sequence

Compilation Sequence