An interactive Connect Four game with a powerful AI opponent. The AI uses a depth-limited minimax algorithm with alpha-beta pruning. It was written in C++ and compiled to WebAssembly resulting in a blazingly fast AI that can run locally on your browser.
You can choose between two agents:
Human: Make moves manually. Use this to play against a friend or the AI.
Minimax: AI that uses the minimax algorithm with alpha-beta pruning. You can adjust the AI's strength by adjusting its search depth.
I wrote a whole blog post on the techniques that went into making this AI.
Here's how it works: The AI looks at all the moves that it and its opponent can make, upto a certain depth. It evaluates each of the resulting positions to obtain a score indicating the player that is more likely to win. The AI picks the move that maximizes its score.
Javascript was too slow for handling this logic since the AI has to evaluate millions of positions before making a move. A common solution is to write the AI in a more performant language and have it run on the server-side. But that requires setting up and managing a server.
Instead, I wrote the algorithm in C++ and compiled it to WebAssembly using Emscripten. This allows the code to run completely on the client-side, no server required! The compiled Wasm file is only 2.6KB in size and is not much slower than running C++ natively. On Google Chrome running on my Apple M1 Macbook, the AI can evaluate ~30,000 positions in 1 millisecond.
This project is open source. You can find more of my projects on my website.