Connect Four – Puissance 4 Wasm & Rust

Construit pour explorer les capacités de Rust et de WebAssembly dans le navigateur, ce projet est une démonstration technique d'un moteur d'IA haute performance fonctionnant à 100 % côté client, sans serveur de calcul ni latence réseau.

🎯 Problème & Pertinence Technique

Implémenter un algorithme d'arbre de recherche de type Minimax en JavaScript/TypeScript montre rapidement ses limites : coût de la gestion mémoire, pauses dues au Garbage Collector et ralentissements lors des évaluations en profondeur.

Pour garantir une réactivité parfaite sans déporter les calculs sur une API backend, l'ensemble de la logique de jeu et du moteur décisionnel a été conçu en Rust puis compilé en WebAssembly. Ce choix permet d'exécuter une IA imbattable à une profondeur de recherche de 6 directement sur le thread principal.

🛠️ Sous le Capot (Stack & Architecture)

• Front-End & UI : React, Vite, Tailwind CSS, Jotai.
• Design : Maquette sur-mesure conçue sur Figma.
• Moteur & IA : Rust (compilé en Wasm via wasm-bindgen), crate minimax.
• Serving & Distribution : Binaire Axum en Rust faisant office de serveur de fichiers statiques ultraléger.
• DevOps & Infrastructure : Build multi-stage Docker (compilation Rust/Wasm, build des assets Vite/React, assemblage du binaire Axum final) auto-hébergé sur Dokploy.

Choix d'architecture clés :

• Backtracking à zéro allocation (Undo System) : Plutôt que d'instancier une nouvelle grille de jeu à chaque branche de l'arbre Minimax, la structure de données en Rust mute et annule chaque coup (undo). Cette réutilisation de mémoire limite drastiquement le footprint mémoire lors des phases d'évaluation.
• Gestion d'état atomique (Jotai) : Une couche de synchronisation fine lie les états réactifs React aux données exposées par le module Wasm à chaque tour de jeu.

🥊 Défis & Apprentissages Rust

• Compréhension des FFI (wasm-bindgen) : Apprivoiser la frontière entre TypeScript et Wasm, comprendre la gestion du cycle de vie des types et minimiser le surcoût lié aux passages de données au travers du bridge.
• Appropriation du système de traits en Rust : Modéliser les règles du Puissance 4 pour respecter les contrats imposés par les traits de la crate minimax, et concevoir une fonction d'évaluation heuristique pertinente pour guider l'exploration de l'arbre.
• Orchestration UX vs Rendu Synchrone : Concilier l'exécution synchrone et quasi-instantanée du module Wasm avec les contraintes d'animations côté React (chute des jetons, transitions) pour maintenir une expérience utilisateur naturelle.