I built a zero-backend chess audit tool using Stockfish WASM and client-side processing

Hey dev.to community! 👋

I wanted to share a browser-based tool I recently built: Chess Blunder Heatmap.

Instead of focusing on single-game move-by-move engine analysis, the app aggregates a player’s game history to generate a macro-level heatmap of weak board squares and a phase breakdown (opening, middlegame, endgame).

🛠️ The Tech Stack & Architecture
Frontend: Clean client-side JavaScript hosted on Vercel.

Engine: Stockfish WASM running directly in the browser.

Backend: None. Everything is processed locally on the user's client.

💡 Why WebAssembly & Client-Side?
Zero Server Costs: Offloading engine evaluation to the client means zero compute bill or complex server infrastructure.

Privacy & Frictionless UX: Users don't need to create an account, log in, or store their game logs on a remote server. You just enter a Chess.com username and run the audit.

🧪 Features
Visual board heatmap showing exact squares where blunders occur over time.

Phase performance metrics (opening, middlegame, endgame).

Instant testing with famous profiles (e.g., test Hikaru to audit a GM's blind spots).

Check out the live tool here: https://chess-blunder-heatmap.vercel.app/

I’d love to hear your thoughts on performance, WASM execution limits, or UI/UX feedback!