WASM Interactive Demos | Mathematics
Interactive mathematical visualizations compiled from Rust to WebAssembly. These run entirely in your browser — no server round-trips.
Intuition
Mathematics you can touch: Interactive demos let you play with mathematical concepts — twist surfaces, adjust parameters, and watch how functions change in real time. This is learning by doing, not just by reading.
Why it matters: Visual intuition is more powerful than abstract definitions — seeing a Fourier series converge, watching a matrix transformation stretch space, or exploring a surface curvature makes the mathematics stick in your memory.
The key insight: WebAssembly brings near-native performance to the browser, making real-time mathematical computation feasible — these demos run entirely in your browser, with no server round-trips, enabling instant feedback.
Why This Matters
WebAssembly (WASM) enables near-native performance in the browser, making real-time mathematical visualisation feasible. These demos combine Rust’s performance and safety guarantees with WebAssembly’s portability — you can explore mathematical concepts interactively without installing anything.
Fourier Series Square Wave
The Fourier series approximates a square wave by summing sine waves of increasing frequency. More terms = better approximation.
Adjust the Terms slider to see how the approximation improves with higher-frequency components.
Sine Wave
A reference implementation showing a simple sine wave rendered via WASM.
How It Works
Each widget is compiled from Rust to WebAssembly using wasm-pack. The Rust code performs the mathematical computation (e.g., evaluating the Fourier series at each pixel), and the results are rendered to an HTML canvas element via JavaScript interop.
Cross-References
- Fourier Analysis: Fourier series decomposition is a central topic in real analysis, connecting periodic functions to infinite sums of sines and cosines.
- Linear Algebra: The sine and square wave visualisations illustrate orthogonal function bases, a key concept in linear algebra.
- Complex Analysis: Complex exponentials provide an alternative formulation of Fourier series via Euler’s formula.
Common Mistakes
Assuming WASM runs natively in the browser without compilation: WebAssembly is not a source format — it must be compiled from Rust (or another language) via wasm-pack or wasm-bindgen. Writing Rust code alone does not produce a runnable WASM module; you need the full toolchain to generate the .wasm binary and JavaScript glue code.
Confusing canvas rendering with DOM manipulation: WASM widgets render to an HTML <canvas> element, not the DOM. You cannot inspect individual drawn elements with CSS or JavaScript selectors. If you need interactive DOM elements, use Astro components instead of canvas-based WASM widgets.
Forgetting that WASM runs in a sandboxed environment: WASM modules cannot access the file system, network, or browser APIs directly. All I/O must go through JavaScript imports defined in the bindgen configuration. Trying to use std::fs or reqwest directly will fail at runtime.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.
Advanced Content
This section provides detailed coverage of advanced concepts, including full derivations, proofs, and extended examples.
Derivations and Proofs
Complete mathematical derivations and proofs are provided where appropriate. Each step is explained to ensure understanding of the underlying reasoning.
Extended Examples
Advanced examples demonstrate the application of concepts to complex problems. These examples go beyond standard exam questions to develop deeper understanding.
Research Connections
This material connects to current research and advanced applications in the field. Understanding these connections provides context for the study material.
Prerequisites
Ensure you have mastered the prerequisite material before attempting this advanced content.