Soulace

Soulace is an experimental web browser built as a final project for CSSE 432 (Computer Networks) at Rose-Hulman Institute of Technology. Instead of parsing HTML, CSS, and JavaScript, it defines its own front-end stack: pages are written in YAML, styled with Sass, and scripted with Luau (a statically-typed Lua dialect). It is then rendered natively with egui on a wgpu GPU backend, with no browser engine or web view underneath. There's a two-crate Cargo workspace: a server that serves site directories over HTTP, and a client that fetches, parses, and renders them.

Because Why Not?

I personally love indentation-based languages. In fact, I adore them so much that the entire front-end stack for this browser only takes in indentation-based languages!

Some specifications of this browser was also based off of existing HTML attributes for inspiration.

The Stack

Web equivalent	Soulace	Explanation
HTML	YAML	A page's body is a YAML sequence of elements (h1, p, button, textedit, link, details, codeedit...) that conveniently correlates to an egui element.
CSS	Sass	Pages point to a .sass file in their YAML head. The client compiles it to CSS at load time, parses the result, and applies colors/font sizes per tag.
JavaScript	Luau	Pages can attach a .luau script. Interactive elements call named Luau functions on events; a textedit with onsubmit: echo runs the script's echo function when you hit enter.
Browser engine	egui + wgpu	Browser chrome (address bar, back/forward/reload) and page content are both drawn immediate-mode with egui, GPU-backed by wgpu, via eframe.
server	warp + reqwest + tokio	The server is a thin warp static file server exposing a web/ directory of "sites." The client fetches pages/assets asynchronously, which bridges async fetches into the synchronous egui render loop.

Project Layout

soulace/
├── client/                 the browser itself (crate: soulace)
│   ├── src/
│   │   ├── main.rs         egui app, YAML/Sass parsing, event loop
│   │   └── lib.rs          Element/Styles types
│   └── template/
│       └── default.sass    fallback stylesheet used when a page defines none
├── server/                 static file server (crate: soulace-server)
│   ├── src/main.rs         server exposing ./web/
│   └── web/                example "sites"
│       ├── test/           home.yaml + home.sass + home.luau
│       └── john/           about.yaml
└── Cargo.toml

Getting Started

Requires a recent stable Rust toolchain (2024 edition) and a system capable of running wgpu.

1. Start the server: Serves server/web/ on localhost:3030:

cd server
cargo run

2. In a second terminal, start the client: It boots straight into test/home.yaml fetched from the running server:

cd client
cargo run

Writing Pages

A minimal example site file, let's call it example.yaml:

head:
  title: Home
  style: example.sass
  script: example.luau
 
body:
  - h1: Welcome!
  - p: This is a paragraph.
  - button: Click me!

Drop that file (along with its .sass/.luau files) into a subdirectory of server/web/, then navigate to <folder>/<file>.yaml in the client's address bar.

Status

This was a course final project and proof of concept, not a production browser (obviously). Some elements like buttons and links are drawn but don't yet trigger Luau callbacks or navigation, and there's no tabs, caching, or settings menu. Would be very interesting to implement those if given more time!