How I Built a C++20 Quantum Simulation Platform with 3D Bloch WebGL Telemetry

Sahastranshu Sharma — Tue, 08 Sep 2026 10:50:12 +0000

I built Itachi Quantum Studio, a browser-based quantum simulation platform that combines a C++20 simulation core with an interactive WebGL frontend. You can try the live platform here: https://itachi-quantum.onrender.com/. The goal wasn't to build another small 4–8 qubit circuit visualizer, but to create a unified environment where quantum circuits, simulation engines, state telemetry, visualization, and quantum research experiments could work together.

The Problem

Most beginner-friendly quantum simulators make visualization easy but become limited as circuits grow. On the other side, powerful quantum frameworks provide extensive functionality but generally require a Python environment, packages, notebooks, or command-line tooling.

I wanted to explore a different approach:

C++20 for the computational core + Web technologies for interaction and visualization.

This separation became the foundation of Itachi Quantum Studio.

The Simulation Architecture

The simulator isn't based around a single algorithm. Different quantum problems require different representations.

Itachi currently supports four simulation approaches:

1. State Vector

The exact state-vector simulator represents the full quantum state as complex amplitudes.

For an n-qubit system, the state contains:

2^n

complex amplitudes.
This makes state-vector simulation extremely useful for exact calculations, but memory requirements grow exponentially. I use C++20 with Eigen, OpenMP parallelization, and AVX2 SIMD optimization to make this path as efficient as possible.

2. Matrix Product States

For circuits with relatively low entanglement, representing the complete state vector isn't always necessary.

The MPS engine represents the state as a collection of tensors connected through bond dimensions. This allows significantly larger systems to be explored when the circuit structure is suitable for tensor-network simulation.

*3. Stabilizer Simulation
*
Clifford circuits have an important mathematical property that allows them to be simulated without storing the complete state vector.

Itachi implements Aaronson-Gottesman stabilizer tableaus, making much larger Clifford circuits practical to experiment with.

4. Density Matrix / Lindblad Simulation

Real quantum systems aren't perfectly isolated.

To experiment with noisy and open quantum systems, Itachi also includes density-matrix simulation using Lindblad master-equation dynamics.

This provides a different perspective from ideal state-vector simulation and makes noise-related experiments possible.

Building the Circuit

The frontend provides a drag-and-drop circuit editor supporting gates such as:

H
X / Y / Z
S / T
CX / CZ
SWAP
Rx / Ry / Rz
U3 The important architectural decision here was to keep the circuit representation independent from the visualization.

The UI creates a circuit description.

The simulation backend consumes that description.

The telemetry layer converts the resulting state into data that the frontend can visualize.

That separation makes it possible to add new simulation engines without rebuilding the entire interface.

Getting Quantum State Telemetry into the Browser

This was one of the more interesting parts of the project.

The simulator produces information such as:

Complex amplitudes
Measurement probabilities
Phase angles
State purity
Shannon entropy
Bloch coordinates

For a single qubit, the Bloch vector can be represented as:

r = (rx, ry, rz)

The frontend receives these values and updates the visualization independently from the simulation engine.

This means the Bloch sphere isn't simply an animation. It represents telemetry generated from the simulated quantum state.

3D Bloch Sphere with WebGL

For visualization, I used React, TypeScript, Three.js, and WebGL.

The Bloch sphere provides an intuitive way to see how operations transform a qubit.

Instead of only displaying:

|ψ⟩ = α|0⟩ + β|1⟩

the interface can show the corresponding state geometrically.

The visualization includes:

State vector
θ and ϕ
Cartesian Bloch coordinates
State trajectory
Purity information

This was particularly useful when experimenting with rotation gates because the mathematical transformation becomes visually apparent.

Quantum Error Correction

I also wanted the platform to go beyond basic circuit simulation.

Itachi includes an interactive Surface-17 quantum error-correction environment.

The implementation models a distance-3 rotated surface-code lattice and allows X/Z errors to be injected and detected through stabilizer syndrome measurements.

The resulting syndrome information can then be processed using Minimum-Weight Perfect Matching (MWPM) decoding.

The workflow becomes:

Quantum state → Error → Syndrome → Decoder → Correction

Having this process represented visually makes QEC considerably easier to experiment with than reading decoder output from a terminal.

Going Beyond Circuits

The platform has gradually expanded into several specialized quantum experiments.

These include:

VQE & QAOA

The chemistry and optimization environment supports experiments such as H₂ ground-state calculations and MaxCut using parameterized circuits and classical optimizers.

OpenPulse

The pulse environment explores transmon control using Gaussian, DRAG, and square envelopes, including Rabi dynamics and leakage-related behavior.

Quantum Machine Learning

The QML playground uses parameterized quantum circuits and ZZ feature maps to visualize nonlinear decision boundaries.

The common idea behind all of these tools is the same:

Don't just execute the algorithm. Make its behavior observable.

Exporting Circuits

Another design goal was interoperability.

A circuit created visually shouldn't have to stay inside the platform.

Itachi supports export/generation for:

IBM Qiskit
Google Cirq
OpenQASM 2.0
OpenQASM 3.0
LaTeX Quantikz

This makes the visual editor useful as a prototyping layer before moving experiments into another development environment.

Hardware-Aware Optimization

I also implemented circuit optimization and routing concepts rather than treating the circuit as an abstract collection of gates.

The optimizer includes techniques such as:

Gate cancellation
Rotation fusion
Commutation-based optimization
Peephole optimization
SWAP insertion for routing

The routing layer can model different hardware connectivity structures including linear, grid, and Heavy-Hex-style topologies.

Why C++20?

The simulation core was intentionally built in modern C++ rather than implementing everything in JavaScript.

Quantum simulation is computationally expensive, and C++ provides access to:

Efficient memory management
SIMD instructions
Multithreading
Native numerical libraries
Predictable performance characteristics

The frontend doesn't need to know how the computation happens.

It only needs a clean interface for submitting circuits and receiving results.

The Browser Fallback

One practical problem with a native simulation backend is availability.

A web application should still be usable when a native bridge is restarting or unavailable.

So I added an in-browser JavaScript simulation fallback.

The result is a hybrid architecture:

Browser UI → Simulation API → Native C++ engine

with:

Browser UI → JavaScript fallback

when the native execution path isn't available.

This keeps the application usable instead of turning a backend restart into a completely broken interface.

What I Learned

The biggest lesson from building this wasn't a particular quantum algorithm.

It was that simulation and visualization should be designed together, but implemented independently.

A fast simulator with poor observability is difficult to learn from.

A beautiful visualization backed by a tiny simulator becomes limited quickly.

The interesting space is in between:

high-performance computation + meaningful telemetry + interactive visualization.

That's the direction I'm continuing to explore with Itachi Quantum Studio.

The project is still evolving, particularly around simulation performance, larger circuits, error-correction experiments, visualization, and developer tooling.

If you're interested in quantum simulation, C++, WebGL, tensor networks, quantum error correction, or quantum software architecture, I'd be interested in hearing how you would approach the architecture differently.

Live project: https://itachi-quantum.onrender.com/

Live project: https://itachi-quantum.onrender.com/
This makes state-vector simulation extremely useful for exact calculations, but memory requirements grow exponentially. I use C++20 with Eigen, OpenMP parallelization, and AVX2 SIMD optimization to make this path as efficient as possible.

DEV Community: Sahastranshu Sharma