Bird's eye view

The project consists of two main parts: The user interface (often referred to as frontend), and modularized Rust packages that implement the algorithms (often yet falsely referred to as backend). This architecture allows us to execute computationally heavy algorithms within the somewhat faster WebAssembly environment and thus eliminates the need for a proper backend server. All computations will run locally, it will be a static website.

On the top level, this project is a Node.js application. The Rust crates are located in the rust/ directory. Here they are compiled using wasm-pack which outputs a JavaScript Node.js compatible package, which is then imported into the frontend code (just like any other Node.js package).

"Backend"

Within the Rust environment there are four special workspace members: algorithm, algorithm/impl, graph and algorithm/example.

• algorithm and algorithm/impl define a framework on defining algorithms. They aim to reduce boilerplate and redundant code to a minimum. Since procedural macros need to be implemented in their own Rust crate, this is split up into two crates, but you only ever need to use algorithm directly.

• graph contains a library that provides an extendable graph implementation that can be imported into algorithm modules to run the algorithm on.

• algorithm/example serves as both an example and as a template.

All of these have their own wiki entry. It is recommended to read those first if you are unfamiliar with the code.

"Frontend"

The code outside the rust/ directory is considered frontend code. The majority of our work is located within the src/ directory. The code is seperated into (currently) five categories:

• algorithms/: everything that is algorithm specific, ideally the same files are always required per algorithm
  • adapter.ts to translate between Rust and TS data types
  • config.ts configuring graph and graph display properties (e.g. some algorithms require a directed graph)
  • hook.ts defining a React hook that can be used within the Pages code supplying necessary display data
• components/: shared algorithm unspecific React components
• hooks/: shared algorithm unspecific React hooks
• routes/: containes the code for our pages. Part of it is the Training Mode specific routing described here.
• utils/: shared algorithm unspecific auxiliary (helper) functions