Inspiration

I've always been fascinated by the idea of bringing together technologies that don't belong together - like Dr. Frankenstein assembling his creature from incompatible parts. As a Doctor of Sciences, I work with huge amounts of experimental data, which require robust mathematical processing. In recent decades, advances in ML and DL reached my field of research, and I transformed into a data science enthusiast. When I looked at the modern ML/DL landscape, I saw Python everywhere, high-level frameworks abstracting everything away, and performance being sacrificed for convenience. For example, if you have no CUDA-compatible GPU, you cannot reap all benefits of PyTorch and TensorFlow libraries for DL/ML tasks. I wondered: what if I could build a neural network that runs at Assembly-level speeds, directly in a browser, by stitching together WebAssembly SIMD, C, and JavaScript? The challenge wasn't just to make it work - it was to make something unexpectedly powerful from parts that seem fundamentally incompatible.

What it does

Frankenstein Neural Web is a fully functional artificial neural network that trains and runs entirely in your browser. Upload a CSV dataset with 1-10 input features (supporting both numeric and categorical data), and it trains a configurable three-layer neural network using gradient descent and backpropagation.

The twist? The performance-critical computations - dot products, activation functions, weight updates - are implemented using WebAssembly SIMD intrinsics, giving it Assembly-level performance that blows traditional Python-based neural networks out of the water.

Key capabilities:

  • Configurable architecture: Adjust hidden layer size from 2 to 20 neurons
  • Multiple activation functions: Choose between Sigmoid, ReLU, or Tanh
  • Real-time visualizations: Interactive loss graphs, weight heatmaps, and accuracy metrics
  • Pre-loaded datasets: XOR, Linear Regression, and Iris Setosa for instant experimentation
  • Mixed data support: Automatically handles numeric and categorical features

No servers, no Python, no TensorFlow - just raw computational power reanimated in the browser with a dark Frankenstein laboratory aesthetic.

How we built it

I built this project as a true chimera of incompatible technologies:

The SIMD Core (Assembly-level): I wrote the neural network's computational heart in WebAssembly SIMD using intrinsics like wasm_f32x4_mul and wasm_f32x4_add. This is as close to raw Assembly as you can get in a browser - vectorized operations processing 4 floats simultaneously, compiled with Emscripten's -msimd128 flag. I implemented multiple activation functions (Sigmoid, ReLU, Tanh) all at the SIMD level for maximum performance.

The C Orchestration Layer: I wrapped the SIMD core in C code that manages network state, coordinates training loops, and handles memory allocation. The C layer now supports dynamic network configuration (2-20 hidden neurons), tracks training metrics, and manages weight matrices for visualization. C and WebAssembly SIMD don't naturally play together, but by declaring SIMD functions as extern and carefully managing the compilation pipeline, I made them work as one.

The JavaScript Interface: I bridged the low-level WASM module to the web using vanilla JavaScript (no frameworks). Using Emscripten's cwrap, I exposed C functions to JavaScript, built a CSV parser that handles mixed numeric/categorical data, implemented real-time Chart.js visualizations for loss tracking, created interactive weight heatmaps, and built an intuitive UI with pre-loaded datasets that feels like you're working in Dr. Frankenstein's laboratory.

The Build Pipeline: Emscripten compiles both C and SIMD code into a single WebAssembly module with -O3 optimization, dynamic memory growth, and carefully exported functions. The result is neurobrain.wasm - a reanimated neural network running at speeds Python can only dream of, now deployed on Netlify for instant access.

Challenges we ran into

Making SIMD and C cooperate: WebAssembly SIMD intrinsics and C don't naturally integrate. I had to carefully structure the code so Emscripten would compile both layers correctly, ensuring SIMD functions were properly linked and called from C without type mismatches. Adding multiple activation functions at the SIMD level required careful vectorization of each function's derivative.

Memory management across language boundaries: Passing data between JavaScript, C, and SIMD required meticulous memory management. I had to manually allocate WASM heap memory, copy JavaScript arrays into it, ensure proper alignment for SIMD operations, and clean up without leaks. This became even more complex when adding weight extraction for visualization - copying large weight matrices back to JavaScript without performance degradation.

Dynamic network configuration: Implementing configurable hidden layer sizes (2-20 neurons) while maintaining SIMD optimization was challenging. I had to ensure memory allocation was dynamic, weight matrices were properly sized, and SIMD operations could handle variable-length vectors efficiently.

Categorical data encoding: Adding support for mixed numeric and categorical features required implementing one-hot encoding in JavaScript, then seamlessly passing the expanded feature vectors to the WASM module without breaking the existing numeric pipeline.

Browser compatibility: Not all browsers support WebAssembly SIMD. I had to target modern browsers (Chrome 91+, Firefox 89+, Safari 16.4+) and accept that older browsers simply can't run this chimera.

Real-time visualization performance: Rendering loss graphs and weight heatmaps in real-time during training required careful optimization to avoid blocking the UI thread while WASM computations were running.

Accomplishments that we're proud of

Assembly-level performance in a browser: I achieved computational speeds that rival native applications by using WebAssembly SIMD. Operations that would take Python milliseconds complete in microseconds - this is a neural network that actually performs like low-level code should.

Successfully stitching incompatible technologies: I made WebAssembly SIMD, C, and JavaScript work together seamlessly. These technologies weren't designed to cooperate, but I forced them into harmony, creating something more powerful than any single piece.

Feature-complete ML platform: What started as a proof-of-concept now includes configurable architectures, multiple activation functions, real-time visualizations, pre-loaded datasets, and mixed data support - all while maintaining Assembly-level performance.

Zero server dependency: Everything runs client-side. No Python backend, no cloud APIs, no server costs. Upload data, configure your network, train with real-time feedback, get predictions - all in your browser with Assembly-level speed.

Educational value with production features: This project demonstrates that you don't need high-level frameworks to understand neural networks. By implementing backpropagation, gradient descent, and multiple activation functions at the SIMD level, I've created something that teaches ML fundamentals while delivering real performance and usability.

Beautiful visualizations: The real-time loss graphs and weight heatmaps make the learning process transparent and engaging, showing users exactly how their network is evolving during training.

What we learned

Low-level optimization matters: The performance difference between Python and SIMD is staggering. Vectorized operations processing 4 floats at once, compiled to WebAssembly, are orders of magnitude faster than interpreted Python loops - even with all the new features added.

Emscripten is incredibly powerful: It's not just a C-to-WASM compiler - it's a bridge between incompatible worlds. Learning to use its flags, exported functions, and memory management tools was crucial. Mastering bidirectional data flow (JavaScript → WASM for training, WASM → JavaScript for visualization) unlocked powerful capabilities.

Browser capabilities are underestimated: Modern browsers can run Assembly-level code through WebAssembly AND render beautiful visualizations simultaneously. The web platform is far more powerful than most developers realize.

Constraints breed creativity: By forcing myself to avoid frameworks and high-level abstractions, I had to deeply understand how neural networks actually work at the computational level. This understanding made it easier to add advanced features like configurable architectures and multiple activation functions.

User experience matters even for low-level projects: Adding pre-loaded datasets, real-time visualizations, and intuitive controls transformed this from a technical demo into something people actually want to use and learn from.

What's next for Frankenstein Neural Web

More network architectures: Add support for deeper networks (multiple hidden layers) and convolutional layers for image processing.

Advanced training features: Implement mini-batch gradient descent, learning rate scheduling, momentum optimization, and adaptive learning rates (Adam, RMSprop) - all at the SIMD level.

Enhanced visualizations: Add network architecture diagrams, activation distribution plots, and 3D weight space visualization.

Performance benchmarks: Create head-to-head comparisons against Python/NumPy, TensorFlow.js, and other frameworks to quantify the SIMD advantage with real metrics.

Mobile optimization: Optimize for mobile browsers and explore WebGPU integration for even more parallel processing power.

Export/Import models: Allow users to save trained networks and reload them later, enabling model sharing and deployment.

More datasets and problem types: Add multi-class classification support, time series prediction, and additional pre-loaded datasets from classic ML problems.

The creature is alive and thriving - but there's so much more power to unleash.

Built With

Share this project:

Updates